如何从窗体，php或jquery生成查询字符串（url）？

Question

我正试图从下面的表单中生成一个特定的URL。 会有一个日历，日期将进入网址。 也是来自9张票类型和每张票的数量的值。 所以我的网址会是这个样子

https://sales.site.com/?action=quicksale&venueid=1&businessdate=2012-10-05&ticketids=6,8&quantities=1,1

有了这些值： 行动：总是 “quicksale”， venueid：始终为 “1”， businessdate：要求销售日期;可以是mm-dd-yyyy或yyyy-mm-dd， ticketids：见下面的图表， 数量：按ticketid的顺序排列。

我该如何处理这个问题，并且应该使用php还是jQuery？发布或获取。 日历应该是JQuery吗？

寻找建议，感谢

     <form method="post" action="">--> 
      <div class="quick-book-form-elements"> 
       <table width="255" class="quick-book-table" cellpadding="4"> 
        <tbody> 
         <tr class="quick-book-days"> 
          <th>&nbsp;</th> 
          <th><img src="../public/img/1day-small.png" alt="" /></th> 
          <th><img src="../public/img/2day-small.png" alt="" /></th> 
          <th class="quick-book-last"><img src="../public/img/3day-small.png" alt="" /></th> 
         </tr> 

         <tr class="quick-book-adults"> 
          <th class="quick-book-labels"> 
           Adult 
          </th> 
          <td> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$40/ea</span> 
           </div> 
          </td> 

          <td> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$50/ea</span> 
           </div> 
          </td> 
          <td class="quick-book-last"> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$60/ea</span> 
           </div> 
          </td> 
         </tr> 

         <tr class="quick-book-child"> 
          <th class="quick-book-labels">Child</th> 
          <td> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$30/ea</span> 
           </div> 
          </td> 
          <td> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$40/ea</span> 
           </div> 
          </td> 
          <td class="quick-book-last"> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$50/ea</span> 
           </div> 
          </td> 
         </tr> 

         <tr class="quick-book-family"> 
          <th class="quick-book-labels">Family</th> 
          <td> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$125/ea</span> 
           </div> 
          </td> 
          <td> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$155/ea</span> 
           </div> 
          </td> 
          <td class="quick-book-last"> 
           <div class="ticket-style-quick-book"> 
            <select class="adult-ticket-select"> 
             <option value="0">0</option> 
             <option value="1">1</option> 
            </select> 
            <span class="quick-book-price">$185/ea</span> 
           </div> 
          </td> 
         </tr> 
        </tbody> 
       </table> 
      </div> 
     <a href="http://sales.site.com/" title="" class="quick-book-submit-btn"></a> 
     <input type="submit" class="quick-book-submit-btn" name="quick-book-submit-btn" value="" /> 
    </form> 
</div><!-- end quick-book-form div --> 

Answer 1

日历，你的确可以使用jQuery的UI之一。这是一个好的部件，易于配置，功能非常强大。

http://jqueryui.com/demos/datepicker/

你可以配置它来把你想要的格式输入（YYYY-MM-DD例如）

最后，你应该添加一个监听器提交事件，执行你的行动修改：

// This function will be call before the submit 
$("#YOUR_FORM_ID").submit(function(submitEvent) { 

    // Initialize the query param array 
    var queryParams = []; 

    // Fill the query param with values 
    queryParams.push("action=quicksale"); 
    queryParams.push("venueid=1"); 
    queryParams.push("businessdate=" + $("#YOUR_INPUT_DATE_ID").val()); 
    // etc... 

    // Finally update the form action 
    $(this).attr('action', 'https://sales.site.com/?' + queryParams.join("&")); 

    // The action has been updated 
    // The submit will process 
});