jqGrid自定义表单来搜索数据(选择框问题)

时间:2011-04-28 13:05:44

标签: php jquery plugins jqgrid

我使用jqGrid作为数据网格,我已经实现了一个自定义表单来搜索数据。 我的问题是我无法搜索从选择框中选择的数据。

这是我的jqGrid脚本

<script>
//autocomplete function
function autocomplete_element(value, options) {
        // create input element
        var $ac = $('<input type="text" />');
        // setting value to the one passed from jqGrid
        $ac.val(value);
        // creating autocomplete
        $ac.autocomplete(
            {
                source: <?php echo $tokens ; ?>

            }
        );
        // returning element back to jqGrid
        return $ac.get(0); 

    }

    function autocomplete_value(elem, op, v) {
        if (op == 'set') {
            $(elem).val(v);
        }
      return $(elem).val();
    }


//jqGrid


$(document).ready(function() {
jQuery("#list1").jqGrid({
    url:'data.php?q=customer',
    datatype: "json",
    //mtype: "POST",
    colNames: ['License ID', 'Name', 'Last name', 'First name', 'Birthdate', 'Medical field', 'Zipcode', 'City', 'Area', 'Address', 'License Exp.', 'Owner', 'Active'],
    colModel: [
                {name:'licenseID',index:'licenseID', width:70, align:"center", editable:true},
                {name:'name',index:'name', editable:false},
                {name:'lastname',index:'lastname', hidden:true,editable:true, edittype:'text', editoptions:{size:40}},
                {name:'firstname',index:'firstname', hidden:true,editable:true, editrules: {edithidden:true}, edittype:'text', editoptions:{size:40}},

                {name:'birthdate',index:'birthdate', sorttype:'date', width:70,align:'center', formatter:'date', editable:true,editoptions:{size:40}},

                {name:'medicalfield',index:'medicalfield', width:100, editable:true, edittype:'select', editoptions:{size:60, value:"<?php echo $mf_array; ?>"}  }, 

                {name:'zipcode',index:'zipcode', width:53, align:'center', editable:false},
                {name:'city',index:'city', width:100, editable:false},
                {name:'area',index:'area', width: 100, editable:false},

                {name:'address',index:'address', width: 53,  align:'center', hidden:true, editable:true, edittype:'custom', editoptions:{size:300, 'custom_element': autocomplete_element, 'custom_value': autocomplete_value}},


                {name:'licenseexpiration',index:'licenseexpiration',sorttype:'date', width:70, align:'center', formatter:'date', editable:true, editoptions:{size:40}},

                {name:'owner',index:'owner', width:100,editable:true, edittype:'select', editoptions:{size:60, value:"<?php echo $o_array; ?>"}  },
                {name:'rstatus',index:'rstatus', width:50, align:'center', editable:true, edittype:'select', editoptions:{value:"1:Yes;0:No"}}

              ],
    rowNum:25,
    rowList:[25,50,100],
    pager:'#pager1',
    sortname:'name',
    viewrecords: true,
    sortorder: "asc",
    caption: "Customers",
    editurl: "edit_customer.php",
    onSelectRow: function(id){ 
        if(id && id!==lastsel3){ 
            jQuery('#list2').jqGrid('restoreRow',lastsel3); 
            jQuery('#list2').jqGrid('editRow',id,true,pickdates); 
            lastsel3=id; 
        } 
    },
    width:990,
    height:450

});

jQuery("#list1").jqGrid('navGrid','#pager1',{},
    //edit
    {
        closeAfterEdit:true,reloadAfterSubmit:true,modal:true,
        beforeShowForm: function(form) { 
            $('#tr_lastname', form).show();
            $('#tr_firstname', form).show();
            $('#tr_address', form).show();
            },
        onInitializeForm: function(form) { 
            $('#birthdate',form).datepicker({showOn: 'focus',dateFormat: 'dd/mm/yy',changeYear: true, changeMonth:true, zIndex:2000});
            $('#licenseexpiration',form).datepicker({showOn: 'focus',dateFormat: 'dd/mm/yy',changeYear: true, changeMonth:true, zIndex:2000});
            },
    recreateForm: true,
    editCaption: "Edit customer",
    saveData: "Data has been changed! Save changes?",
    bYes: "Yes",
    bNo: "No",
    bExit: "Cancel",
    resize:false,
    checkOnSubmit:true,
    width: 400

    },
    //add
    { 
    closeAfterAdd:true,reloadAfterSubmit:true,modal:true,
        beforeShowForm: function(form) { 
            $('#tr_lastname', form).show();
            $('#tr_firstname', form).show();
            $('#tr_address', form).show();
            },
        onInitializeForm: function(form) { 
            $('#birthdate',form).datepicker({showOn: 'focus',dateFormat: 'dd/mm/yy',changeYear: true, changeMonth:true, zIndex:2000});
            $('#licenseexpiration',form).datepicker({showOn: 'focus',dateFormat: 'dd/mm/yy',changeYear: true, changeMonth:true, zIndex:2000});
            },
    recreateForm: true,
    modal:true,
    addCaption: "Add customer",
    saveData: "Data has been changed! Save changes?",
    bYes: "Yes",
    bNo: "No",
    bExit: "Cancel",
    resize:false,
    checkOnSubmit:true,
    width: 400

    },
    //dell
    {},
    //search
    {}

    );

});

// search functionallity

var timeoutHnd; 
var flAuto = false; 

function doSearch(ev){ 
    if(!flAuto) 
        return; // var elem = ev.target||ev.srcElement; 
    if(timeoutHnd) 
        clearTimeout(timeoutHnd) 
    timeoutHnd = setTimeout(gridReload,500) 
} 

function gridReload(){ 
    var name_mask = jQuery("#search_name").val(); 
    var lid_mask = jQuery("#search_licenseid").val();
    var zc_mask = jQuery("#search_zipcode").val(); 
    var mf_mask = jQuery("#search_medical").val(); 
    jQuery("#list1").jqGrid('setGridParam',{url:"data.php?q=customer&name_mask="+name_mask+"&lid_mask="+lid_mask+"&zc_mask="+zc_mask+"&mf_mask="+mf_mask,page:1}).trigger("reloadGrid"); 
} 

function enableAutosubmit(state){ 
    flAuto = state; jQuery("#submitButton").attr("disabled",state); 
}

</script>

这是我的自定义表单:

 <div id="my-search-form">
    <h3>Search By:</h3>
    <input type="checkbox" id="autosearch" onclick="enableAutosubmit(this.checked)"> Enable Autosearch <br/>
    <p><label>License ID</label><input type="text" id="search_licenseid" onkeydown="doSearch(arguments[0]||event)" />
    <label>Name</label><input type="text" id="search_name" onkeydown="doSearch(arguments[0]||event)" />
    <label>Medical field</label><input type="text" id="search_medical" onkeydown="doSearch(arguments[0]||event)" />
    <label>Zipcode</label><input type="text" id="search_zipcode" onkeydown="doSearch(arguments[0]||event)" />
    <label>Owner</label><input type="text" id="item" onkeydown="doSearch(arguments[0]||event)" />
    <button onclick="gridReload()" id="submitButton" style="margin-left:2px;">Search</button> 
    </div>

这是处理数据的php脚本:

ini_set('max_execution_time', 600);

    $page = $_GET['page']; // get the requested page 
    $limit = $_GET['rows']; // get how many rows we want to have into the grid 
    $sidx = $_GET['sidx']; // get index row - i.e. user click to sort 
    $sord = $_GET['sord']; // get the direction 

    if(!$sidx) $sidx =1; 

    //search

    if(isset($_GET["name_mask"])) 
        $name_mask = $_GET['name_mask']; 
    else $name_mask = ""; 

    if(isset($_GET["lid_mask"])) 
        $lid_mask = $_GET['lid_mask']; 
    else $lid_mask = ""; 

    if(isset($_GET["zc_mask"])) 
        $zc_mask = $_GET['zc_mask']; 
    else $zc_mask = "";

    if(isset($_GET["mf_mask"])) 
        $mf_mask = $_GET['mf_mask']; 
    else $mf_mask = "";

    //construct where clause 
    $where = "WHERE 1=1"; 
    if($name_mask!='') $where.= " AND ( lastname LIKE '%$name_mask%' OR firstname LIKE '%$name_mask%' )"; 
    if($lid_mask!='') $where.= " AND licenseID LIKE '%$lid_mask%'"; 
    if($zc_mask!='') $where.= " AND zipcode LIKE '$zc_mask%'";
    if($mf_mask!='') $where.= " AND m.medicalfield = '$mf_mask'";

    //$where.=" AND lastname LIKE '%zer%' ";

    $result = mysql_query("SELECT COUNT(*) AS count FROM customer ".$where); 
    $row = mysql_fetch_array($result,MYSQL_ASSOC); 
    $count = $row['count'];

    if( $count >0 ) { 
        $total_pages = ceil($count/$limit); 
    } else { 
        $total_pages = 0; 
    } 
    if ($page > $total_pages) $page=$total_pages; 
    $start = $limit*$page - $limit; // do not put $limit*($page - 1) 



    $SQL = "SELECT c.customerid, c.activated as rstatus, c.birthdate, c.zipcode, c.city,c.area, c.firstname, c.lastname, c.subscriberid, c.medicalfieldid, c.licenseexpiration, c.licenseid, s.subscriberID, s.name as subscribername, m.medicalfieldID, m.medicalfield as medicalfield FROM customer c INNER JOIN medicalfield m On c.medicalfieldid = m.medicalfieldid INNER JOIN subscriber s ON c.subscriberid = s.subscriberID ".$where." ORDER BY $sidx $sord LIMIT $start , $limit"; 

    $result = mysql_query( $SQL ) or die("Couldn t execute query.".mysql_error()); 

    $responce->page = $page; 
    $responce->total = $total_pages; 
    $responce->records = $count; 
    $i=0; 
    while($row = mysql_fetch_array($result,MYSQL_ASSOC)) { 
        $responce->rows[$i]['id']=$row[customerid]; 
        $c =$row['rstatus'];
        if ( $c == '1') {
            $rstatus = "Yes";
        }else{
            $rstatus = "No";
        }
        $responce->rows[$i]['cell']=array($row[licenseid],$row[lastname].' '.$row[firstname],$row[lastname],$row[firstname],$row[birthdate],$row[medicalfield],$row[zipcode],$row[city],$row[area],$row[zipcode].'-'.$row[city].'-'.$row[area],$row[licenseexpiration],$row[subscribername],$rstatus); 
        $i++; 
    } 
    echo json_encode($responce);

我的问题是在搜索医疗领域时,这是一个下拉框(选择)。

你能帮忙吗???

1 个答案:

答案 0 :(得分:0)

看来你的问题出现在SQL中:

if($mf_mask!='') $where.= " AND m.medicalfield = '$mf_mask'";

你正在使用like的其他任何地方你正在使用=所以如果你的字段是abc并且你开始输入'a'它将找不到abc所以做类似的事情:

if($mf_mask!='') $where.= " AND m.medicalfield like '%$mf_mask%'";