2015-02-02 3 views
0

데이터베이스에 검색 조건을 저장하기 위해 jqgrid의 검색 대화 상자에 단추를 추가하고 나중에 사용합니다. 해당 버튼을 클릭하면 검색 조건의 필터 속성 인 jqgrid가 필요합니다.검색 필터 저장 사용자 정의 단추를 사용하여 검색 대화 상자에

http://i.stack.imgur.com/31J5x.png [스냅 샷] 때 (사용자 정의 버튼이 검색 대화 상자에 나를 추가) 내가 필터로 저장 한 후 대화 상자를 사용하여 필터 이름을 요청하고 있었다 저장 버튼에 사용자가 클릭.

검색 버튼을 클릭 할 때 검색 기준에 그리드 기반을 다시로드하고 싶지 않습니다.

하지만 데이터베이스에 저장할 필터 속성을 가져올 수 없습니다.

나는 afterRedraw 이벤트를 사용했지만이 필터에 마지막으로 추가 한 필터가 없습니다.

그래서 빨리 답변 해 주시기 바랍니다.

미리 감사드립니다.

var grid = jQuery("#list_records").jqGrid({ 
     url: "getGridData.php?" + window.location.search.substring(1), 
     searchurl: "getGridData.php?" + window.location.search.substring(1), 
     datatype: 'json', 
     mtype: "GET", 
     colNames: ["Task Id", "Title", "Priority", "tags", "Created Date", "Last Update Date", "Complete Date"], 
     colModel: [ 
        { name: 'Task_ID', index: 'Task_ID', width: 200}, 
        { name: 'Title', index: 'Title', width: 200 }, 
        { name: 'Priority', index: 'Priority', width: 200}, 
        { name : 'tags', index : 'tags', width : 200}, 
        { name : 'Created_Date', index : 'Created_Date', width : 200}, 
        { name : 'Last_Updated', index : 'Last_Updated', width : 200}, 
        { name : 'Completed_date', index : 'Completed_date', width : 200} 
       ], 
     sortname: 'Task_ID', 
     viewrecords: true, 
     rownumbers: true, 
     sortorder: "desc", 
     ignoreCase: true, 
     pager: '#perpage', 
     caption: "Task Results", 
     rowNum: 30, 
     ajaxGridOptions: { contentType: 'application/json; charset=utf-8' }, 
     }); 

grid.jqGrid('navGrid','#perpage', {add:false,edit:false,del:false,search:false,refresh:false}).jqGrid('navButtonAdd','#perpage',{ 
       caption: "", 
       title : "Search", 
       id : "filterManipulation", 
       buttonicon:"ui-icon-search", 
       onClickButton: function(){ 
        //console.log(JSON.stringify(filterForSearch)); 
        $("#list_records").setGridParam({ 
         postData: { filters: JSON.stringify(filterForSearch)} 
        }); 

        $("#list_records").jqGrid('searchGrid', 
         {multipleSearch:true, overlay:false, searchOnEnter:true, multipleGroup:true, closeOnEscape:true, showQuery:true,recreateFilter: true, 
         afterShowSearch : function(){ 
          var element = document.getElementById("fbox_list_records_2").getElementsByTagName("tr")[1].getElementsByTagName("td")[1]; 
          var saveAnchor = document.createElement('a'); 
          saveAnchor.setAttribute('id', 'fbox_list_save_query'); 
          saveAnchor.setAttribute('class', 'fm-button ui-state-default ui-corner-all fm-button-icon-left'); 
          saveAnchor.setAttribute('onclick','saveSearch()'); 
          saveAnchor.innerHTML = buttonName; 
          var newAnchor = document.createElement('a'); 
          newAnchor.setAttribute('id', 'fbox_list_new_filter'); 
          newAnchor.setAttribute('class', 'fm-button ui-state-default ui-corner-all fm-button-icon-left'); 
          newAnchor.setAttribute('onclick','newFilter()'); 
          newAnchor.innerHTML = 'New'; 
          element.appendChild(newAnchor); 
          element.appendChild(saveAnchor);      

          var tableDataTag = document.createElement("td"); 
          tableDataTag.setAttribute('id','tdForFilterNameList'); 
          var filterNameList = document.createElement("select"); 
          filterNameList.setAttribute('id','filterNameList'); 
          filterNameList.setAttribute('onChange','loadFilterAttribute()'); 
          var option = new Option("--Select--", "0"); 
          filterNameList.appendChild(option); 
          <?php 
           $userId = 0; 
           $conn = new mysqli("localhost", "root", "$$$$", "$$$"); 
           if (mysqli_connect_errno()){ 
            echo "Failed to connect to MySQL: " . mysqli_connect_error(); 
           } 
           $sql = "select filter_id,filter_name from filters where userID = $userId "; 
           //print $sql; 
           $result = $conn->query($sql); 
           if($result) 
           { 
            while ($row = $result->fetch_assoc()) { 
          ?> 
             var optionTag = document.createElement("option"); 
             optionTag.setAttribute("value", "<?php echo $row['filter_id']?>"); 
             var text = document.createTextNode("<?php echo $row['filter_name']?>"); 
             optionTag.appendChild(text); 
             if(selectedValue == "<?php echo $row['filter_id']?>"){ 
              optionTag.setAttribute("Selected", "true"); 
             } 
             //option = new Option('<?php echo $row['filter_name']?>', '<?php echo $row['filter_id']?>'); 
             filterNameList.appendChild(optionTag); 
          <?php 
            } 
           } 
          ?> 
          tableDataTag.appendChild(filterNameList); 
          var elementForDropDown = document.getElementById("fbox_list_records").getElementsByTagName("table")[0].getElementsByTagName("tr")[0]; 
          elementForDropDown.appendChild(tableDataTag); 
         }, 
         onSearch: function() { 
          var postData = grid.jqGrid('getGridParam','postData'); 
          var $filter = $("#" + $.jgrid.jqID("fbox_" + this.id)), 
          sql = $filter.jqFilter('toSQLString'); 
          $("#list_records").setGridParam({url: "getGridData.php?" + window.location.search.substring(1) + "&sqlQuery=" + escape(sql)}); 
          $("#list_records").trigger("reloadGrid"); 
          loadgridData(postData, sql);  
          fusionChart(postData, sql); 
          return false; 
         }, 
         onReset : function() { 
          var postData = grid.jqGrid('getGridParam','postData'); 
          $("#list_records").setGridParam({url: "getGridData.php?" + window.location.search.substring(1)}); 
          $("#list_records").trigger("reloadGrid"); 
          loadgridData(postData, ''); 
          fusionChart(postData, ''); 
          return false; 
         }, 
         onClose: function(){ 
          filterForSearch = ""; 
          buttonName = "Save"; 
          selectedValue = ""; 
         }, 
         afterRedraw: function (p) { 
          console.log(p.filter); 
         } 
        }); 
       }, 
       position:"last" 
     }); 

위의 코드에는 사용자 정의 탐색 버튼이 추가되었습니다. 이 코드는 사용자의 검색 필터를로드하는 데 사용됩니다. 필터 저장 및 편집 방법.

하지만 저장 버튼을 클릭 할 때 필터를 얻으려면 어떻게해야합니까? 내 질문을 검토 @jtc

http://i.stack.imgur.com/sU00x.png

+0

실제 코드/피들이 유용합니다. – JTC

+0

@ JTC는 충분한 설명입니까, 아니면 더 필요한 것이 있습니까? –

+0

미안하지만 아직도 필요한 걸 이해하지 못합니다. 당신은 아약스 통해 serach, 사용자가 저장을 클릭 할 수 있습니다 그리고 당신은 그가 사용하거나 마지막 입력을 얻으려고? 더 구체적으로 말씀 드리 자면 도움을 드리겠습니다. – JTC

답변

0

감사합니다. 내 질문에 대한 답변은 이미 내 질문에 있습니다.

기본적으로 미리 검색 대화 상자에서 저장, 업데이트, 삭제 기능을 구현했습니다.

검색 대화 상자에서 특정 사용자의 모든 필터를 나열했습니다.

사용자는 새 필터를 만들고 필터를 선택하여 업데이트 및 삭제할 수 있습니다.

나중에 사용자가 다시 로그인 할 때 필터에서 모든 조작을 수행하고 필터 목록에서 특정 필드를 선택하고 그에 따라 검색을 수행합니다.

그래서 하나의 코드가 필요한 경우이 기능에 대해 알려주세요.

감사합니다.