jquery datepicker不发送使用.serialize（）来填充网格的数据

问题描述

我有一个带有2个输入类型=text的表单，1个组合框和其他包含（组合框包含相等，之后，之前和之后的运算符+开始日期（jquery datepicker）+结束日期（jquery日期选择器）但是当我将数据发送到服务器时，它不会使用.serialize（）的URL附加日期参数。

我的方法：

$提交（function（）{
var newUrl =/cpsb/transactionHistory.do?method=getTransactionHistoryDe​​tails&

  $（form＃transactionForm + 
 $（this）.serialize（）; 
 
 $（＃transactionHistory）jqGrid（
setGridParam，
 {url：newUrl ，数据类型：json}）。trigger（reloadGrid）; 
 return false; 
}）; 
  

标记：

 < form class =transformid =transactionForm =postaction => 
< fieldset class =ui-widget ui-widget-content ui-corner-all> 
< legend class =ui-widget ui -wi dget-header ui-corner-all>交易记录< / legend> 
< p> 
< label for =lpn> LPN< / label> 
< input id =lpnname =lpn/> 
< / p> 
< p> 
< label for =sku> SKU< / label> 
< input id =skuname =skuclass =skui ui-widget-content/> 
< / p> 
< p> 
< label for =ttype>事务类型：< / label> 
< select id =ttypename =tranType> 
< option value =>选择事务类型< / option> 
< option value =100> 100收货< / option> 
< option value =110> 110-Shipment< / option> 
< option value =120> 120-托盘更新< / option> 
< / select> 
< / p> 
< p> 
< label for =tdate>交易日期：< / label> 
< select id =tdatename =date> 
< option value =equalsDate> Equal< / option> 
< option>之间< / option> 
< option value =beforeDate>之前< / option> 
< option value =afterDate>之后< / option> 
< / select> 
< input id =sdatetype =textstyle =width：70px/> 
< input id =edatetype =textstyle =width：70px/> 
< / p> 
< p> 
< button class =submittype =submit>搜索< / button> 
< / p> 
< / fieldset> 
< / form> 
  

解决方案

问题很简单。如果您希望输入字段为ids sdate和edate具有 datepicker 将被序列化为 startDate 和 endDate ，您必须修改HTML代码

 < input id =sdatetype =textstyle =width：70px/> 
< input id =edatetype =textstyle =width：70px/> 
  

至

 < input id =sdatename =startDatetype =textstyle =width：70px/> 
< input id =edatename =endDatetype =textstyle =width：70px/> 
  

函数 jQuery.serialize（） serialize只有 name 属性的元素。所有您的< select> 有名称属性，以便它们被序列化。

I have a form with 2 input type="text" , 1 combo box and other contains ( combo box contains equal , after,before & between operators + start date(jquery datepicker)+end date(jquery date picker ) but when i am sending the data to server its not appending date parameters with the url using .serialize().

My approach:

$("form#transactionForm").submit(function() {
    var newUrl = "/cpsb/transactionHistory.do?method=getTransactionHistoryDetails&" +
                 $(this).serialize();

    $("#transactionHistory").jqGrid(
        "setGridParam",
        {"url": newUrl, datatype:"json"}).trigger("reloadGrid");
    return false;
});

mark up:

<form class="transform" id="transactionForm" method="post" action="">
    <fieldset class="ui-widget ui-widget-content ui-corner-all">
        <legend class="ui-widget ui-widget-header ui-corner-all">Transaction History</legend>
        <p>
            <label for="lpn">LPN</label>
            <input id="lpn" name="lpn"/>
        </p>
        <p>
            <label for="sku">SKU</label>
            <input id="sku" name="sku" class="skui ui-widget-content" />
        </p>
        <p>
            <label for="ttype">Transaction Type:</label>
            <select id="ttype" name="tranType" >
            <option value="">Select transaction type</option>
            <option value="100">100-Receipt</option>
            <option value="110">110-Shipment</option>
            <option value="120">120-Pallet Update</option>
            </select>
        </p>
        <p>
            <label for="tdate">Transaction date:</label>
            <select id="tdate" name="date">
                <option value="equalsDate">Equal</option>
                <option>Between</option>
                <option value="beforeDate">Before</option>
                <option value="afterDate">After</option>
            </select>
            <input id="sdate" type="text"  style="width:70px"/>
            <input id="edate" type="text"  style="width:70px"/>
        </p>
        <p>
            <button class="submit" type="submit">Search</button>
        </p>
    </fieldset>
</form>

解决方案

The problem is very easy. If you want that the input fields with ids "sdate" and "edate" having datepicker will be serialized under the names startDate and endDate you have to modify your HTML code from

<input id="sdate" type="text"  style="width:70px"/>
<input id="edate" type="text"  style="width:70px"/>

to

<input id="sdate" name="startDate" type="text" style="width:70px"/>
<input id="edate" name="endDate"   type="text" style="width:70px"/>

The function jQuery.serialize() serialize only elements which has name attribute. All your <select> have name attribute so they are serialized.

这篇关于jquery datepicker不发送使用.serialize（）来填充网格的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！