Используя Coldfusion cfc, как вы форматируете возвращаемые данные для зависимых от jqgrid выборов в форме редактирования? - PullRequest
Новая
       11

Используя Coldfusion cfc, как вы форматируете возвращаемые данные для зависимых от jqgrid выборов в форме редактирования?

1 голос
/ 01 марта 2012

Я пытаюсь выяснить, как настроить динамические зависимые выборки.Это редактирование моего исходного поста, чтобы сделать его более читабельным и понятным.Я включил всю свою сетку на случай, если это поможет, но это может быть слишком много информации.Сетка отображается идеально. 

<!---stylesheets --->
<link rel="stylesheet" type="text/css" media="screen" href="jquery-ui-1.8.17.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="ui.jqgrid.css" />
<script src="jquery.js" type="text/javascript"></script>

<script src="jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="grid.locale-en.js" type="text/javascript"></script>
      <!--- The language file --->
<script src="jquery.jqGrid.min.js" type="text/javascript"></script>
<script>        
$(document).ready(function()
                {        
                    $("#list").jqGrid(
                    {
url:'Users2.cfc?method=getUsers', //CFC that will return the users
datatype: 'json', //We specify that the datatype we will be using will be JSON
cmTemplate:{resizable:false, width:124},

colNames:['Bill To Code','User ID', 'GL_comp_key', 'Branch ID', 'Warehouse ID', 'Final Approver',  'Active', 'Primary Approver', 'Administrative','Secondary Approver'], //Column Names
//The Column Model              

colModel :[
                {name:'ar_bill_key',index:'ar_bill_key',editable:true,searchoptions:{sopt:                 ['eq','lt','le','gt','ge','bw','ew','cn']},
                    editable:true,edittype:"text",editoptions:{size:50},editrules:{required:true},formoptions:{elmprefix:"(*)"}},
{name:'userID',index:'userID',searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"text",editoptions:{size:50},editrules:{required:true},formoptions:{elmprefix:"(*)"}},

Ниже приведены 3 поля, которые я пытаюсь установить как динамически зависимые выборки.Выберите gl_cmp_key, а SO_BRNCH_KEY и so_whs_key выберите отображение зависимых списков.Нужно ли иметь 2 разных сетки?Один для добавления с динамическими выпадающими списками и один для редактирования с динамическими зависимыми выпадающими списками?

                {name:'gl_cmp_key',index:'gl_cmp_key',searchoptions:{sopt:['eq','bw','ew','cn']},
//the values are hard-coded here to get something started.
editable:true,edittype:"select",editoptions:{value:['37','36','CM','35']},editrules:{required:true},formoptions:{elmprefix:"(*)"}},

    {name:'SO_BRNCH_KEY',index:'SO_BRNCH_KEY',searchoptions:{sopt:['eq','bw','ew','cn']},editable:true,edittype:"select",editoptions:{dataUrl:'Users2.cfc?method=getBrnchKey'}, 
    buildSelect: function(data) { 
                 var response = jQuery.parseJSON(data.responseText); 
                 var s = '<select>'; 
                 if (response && response.length) { 
                     for (var i = 0, l=response.length; i<l ; i++) { 
                         var ri = response[i]; 
                         s += '<option value="'+ri+'">'+ri+'</option>'; 
                     } 
                 } 
                 return s + "</select>"; 
             },

Это данные, которые я получаю в ответе JSON Firebug от cfc, показанном ниже.Это не отображается при выборе:
{"COLUMNS": ["SO_BRNCH_KEY"], "DATA": [["BC30"], ["BM35"], ["BF50"], ["BF51"], [ "BF53"], [ "BF54"], [ "BTCO"], [ "BF55"], [ "BF56"], [ "BD65"], [ "BW66"], [ "BI75"], ["BI76"], ["BI77"], ["BI78"], ["BI79"], ["BI80"], ["BI81"], ["BCFG"], ["BC43"], ["BC44"], [" BC48 "], [" BC49 "], [" BCCO "], [" BCMN "], [" BCSA "]]}}

Как мне отформатировать это для отображения в формате html.Я понимаю, столбцы, формат данных не работает.Вот CFC: Выберите so_brnch_key ОТ so_brnch_tbl 

 </cffunction>

Я попытался изменить формат возврата.Хотя я вижу изменения в данных в firebug, тогда нет отображения. 

                 editrules:{required:true},formoptions:{elmprefix:"(*)"}},
                {name:'so_whs_key',index:'so_whs_key',searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"select",editoptions:{dataUrl:'Users2.cfc?method=getWhsKey'},editrules:{required:true},formoptions:{elmprefix:"(*)"}},

// поля для сетки выбирают да или нет 

                {name:'final_approver',index:'final_approver',searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"select",editoptions:{value:"1:Yes;0:No"},editrules:{required:true},formoptions:{elmprefix:"(*)"}},  
                {name:'active',index:'active',searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"select",editoptions:{value:"1:Yes;0:No"},editrules:{required:true},formoptions:{elmprefix:"(*)"}},
                {name:'primary_approver',index:'primary_approver',align:"left",sorttype:"text",searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"select",editoptions:{value:"1:Yes;0:No"},editrules:{required:true},formoptions:{elmprefix:"(*)"}},  
                {name:'admin',index:'admin',searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"select",editoptions:{value:"1:Yes;0:No"},editrules:{required:true},formoptions:{elmprefix:"(*)"}},  
                {name:'secondary_approver',index:'secondary_approver',searchoptions:{sopt:['eq','bw','ew','cn']},
                    editable:true,edittype:"select",editoptions:{value:"1:Yes;0:No"},editrules:{required:true},formoptions:{elmprefix:"(*)"}},

            ],

pager: $('#pager'), //The div tells jqGrid where to put the pager
rowNum:20, //Number of records to show per page
rowList:[20,30,40,50], //Row List, to select how many rows  to see per page
sortorder: "asc", //Default sort order
sortname: "ar_bill_key", //Default sort column
viewrecords: true, //Shows the message on the pager
caption: 'Permissions', //Grid Name
recordtext: "Record {0} - {1} of {2}",

// Информация пейджера 

     rownumbers: true,
     rownumWidth: "30",
     sortable: true,
     height:'auto',
     mtype:'POST',  
     toolbar:[true,"top"],              

//The JSON reader. defines the JSON data returned from the CFC
jsonReader: {
    root: "ROWS", //our data
                page: "PAGE", //current page
                total: "TOTAL", //total pages
                records:"RECORDS", //total records
    userdata:"USERDATA", //Userdata we will pass back for feedback
    cell: "", //Not Used
    ar_bill_key: "0",//Will default to first column
    id:"10" 
                },
    editurl:"Users2.cfc?method=addeditUser" //The Add/Edit function call                
            }               
        ).navGrid('#pager',
            {
        search:true,searchtitle:"Search",//title set for hover
        edit:true,edittitle:"Edit User",viewPagerButtons:false,
        add:true,addtitle:"Add User",
        del:false,deltitle:"Delete User"
            },

// Редактировать параметры.Параметр savekey связывает клавишу Enter для отправки. 

{editCaption:"Edit User",edittext:"Edit",closeOnEscape:true, savekey:  [true,13],errorTextFormat:commonError,reloadAfterSubmit:true,bottominfo:"Fields marked with (*) are required",top:"60",left:"70",width:500}, 
//Add Options
{width:500,addCaption:"Add User",edittext:"Add",closeOnEscape:true,savekey: [true,13],errorTextFormat:commonError,reloadAfterSubmit:true,bottominfo:"Fields marked with (*) are required",top:"60",left:"70"},

// Поиск 

{errorTextFormat:commonError,Find:"Search",closeOnEscape:true,caption:"Search Users",multipleSearch:true,closeAfterSearch:true}
        );

// Функция вызывается, когда при добавлении / редактировании возникает ошибка.Возвращенное сообщение - это то, что будет показано пользователю 

function commonError(data)
{           
return "Error Occured during Operation. Please try again";
}

});

</script>


<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>

<div id="pager" class="scroll"></div>

У меня есть несколько проблем: как отформатировать данные для редактирования формы или добавитьвыбирает из cfc, как отображать динамические выделения и как настроить их как зависимые для редактирования формы.Используя dataUrl и значение, я получил имя столбца и список значений для отображения, но неправильно (не показано).Любое направление к учебникам или сообщениям будет оценено.Я опубликую свое решение, когда оно будет найдено.Спасибо

1 Ответ

2 голосов
/ 06 марта 2012

Да, вы должны использовать параметр editoptions: dataUrl, как вы делали это в опубликованной colModel. Однако ответ от вашего CFC неверен. Из jqGrid документов:

Параметр editoptions dataUrl действителен только для элемента EditType: выберите. Параметр dataUrl представляет URL, откуда элемент выбора HTML должен быть получен. Когда эта опция установлена, элемент будет заполнен значениями из запроса AJAX. Данные должен быть действительным элементом HTML select с желаемыми параметрами - что-то вроде: 

<select> 
<option value='1'>One</option> 
<option value='2'>Two</option> 
...
</select>

Итак, в вашем случае, вместо того, чтобы возвращать объект запроса в виде JSON из вашего CFC, вам нужно возвращать HTML. В настоящее время ваш CFC возвращает это: 

{"COLUMNS":["glKEY"],"DATA":[[""],[35.0],[""],[""],[""]]}

Но вы должны вернуть это (основываясь исключительно на данных вашего примера): 

<select>
  <option></option>
  <option>35.0</option>
  <option></option>
  <option></option>
  <option></option>
</select>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...