2015-10-02 13 views
-1

我有兩個input search boxes的表單,當我在第一個search box中鍵入文本時,它還將我輸入的文本從第一個search box複製到第二個。如何在兩個搜索框中分割/分離輸入文本

這裏是我的search boxes

<form style="margin-bottom: 0px;"> 
    <label>Date From :</label> 
    <input class="search" type="search" data-column="0"> 
    &nbsp; 
    <label>To :</label> 
    <input class="search" type="search" data-column="0"> 
</form> 

形式這裏是我的table

<table class="tablesorter table table-bordered table-condensed" id="cLoanOut" style="table-layout: fixed;"> 
    <colgroup> 
     <col width="110"> 
     <col width="130"> 
     <col width="50"> 
     <col width="60"> 
     <col width="90"> 
    </colgroup> 
    <thead> 
     <tr> 
      <th>Date Ordered</th> 
      <th>Order No.</th> 
      <th>Total Item(s)</th> 
      <th>Total Amount</th> 
      <th>Order Status</th> 
     </tr> 
    </thead> 
    <tbody> 
    </tbody> 
</table> 

而且我PHP顯示行

case "display": 
    $sql = "SELECT * from tb_empgroc_master"; 
//   $myData = mysql_query($sql,$con); 
    $result = $atecCoop->query($sql); 
//   mysql_close($con); 

    $html = ''; $ctr = 0; 
    if ($result->num_rows){ 
     while ($row = $result->fetch_object()){ 
     $id = $row->empgrocmstID; 
     $date_ordered = date("m-d-Y"); 
     $order_no = date($row->order_no); 
     $total_items = number_format($row->total_items); 
     $total_amount = number_format($row->total_amount,2); 
     $order_status = wordwrap($row->order_status); 
     $Order = $row->empgrocmstID; 

     $html .= "<tr id='$id'>"; 
     $html .= "<td class='date_ordered' style='text-align:center'>$date_ordered</td>"; 
     $html .= "<td class='order_no' style='text-align:center'>$order_no</td>"; 
     $html .= "<td class='total_items' style='text-align:right'>$total_items</td>"; 
     $html .= "<td class='total_amount' style='text-align:right'>$total_amount</td>"; 
     $html .= "<td id='$Order' class='order_status' style='text-align:center'>$order_status</td>"; 
     $html .= "</tr>"; 
     } 
    } 
    echo $html; 
break; 

這是我的scriptfilter searchtr上這是第一列Date_Ordered

$.tablesorter.filter.bindSearch($('#cLoanOut'), $('.search')); 

我想篩選日期在date_orderedfrom and to和它的作品,但問題是,當我在search box(Date From)鍵入它也輸入及複印件,我已經從鍵入的文本(Date From)search box(To)

我試着在每個search box中放一些Id's,仍然是一樣的。我也改變了他們的class。但仍然如此。喜歡這個。

<form style="margin-bottom: 0px;"> 
    <label>Date From :</label> 
    <input id="From" class="search" type="search" data-column="0"> 
    &nbsp; 
    <label>To :</label> 
    <input id="To" class="Searches" type="search" data-column="0"> 
</form> 

$.tablesorter.filter.bindSearch($('#cLoanOut'), $('.search')); // or $('#From') 
$.tablesorter.filter.bindSearch($('#cLoanOut'), $('.Search')); // or $('#To') 

還是一樣的。但是,當我改變了search box(To)過程的數據列,他們的文字輸入完全分開。但我希望這兩個過濾的第一列是Date Ordered這就是爲什麼他們是data-column="0"

感謝您的幫助。

這是我的問題

Date from: asdasdasd To: asdasdasd 
+0

我可以不明白你的問題是什麼。 – guramidev

+0

當我在'Date from:'鍵入asdasdasd時,它也會在第二個搜索框中輸入'To:' – Micaela

+0

但是你說你在帖子開頭 – guramidev

回答

0

如果我理解正確的,你必須改變這樣的形式:

<form style="margin-bottom: 0px;"> 
    <label>Date From :</label> 
    <input id="from" class="search" type="search"> 
    &nbsp; 
    <label>To :</label> 
    <input id="to" class="search" type="search"> 
    <input class="realSearch" type="hidden" data-column="0"/> 
</form> 

並應用一些JavaScript,請參閱小提琴http://jsfiddle.net/p9pkv7yu/1/