DataTable内联编辑？ jquery数据表？ [英] DataTable Inline editing ? jquery datatable ?

问题描述

嗨


现在我搞砸了我必须改变我的全部数据库功能。



现在我需要什么我需要在数据表的每一行上都有一个编辑链接作为列。当我点击编辑列时，应转向各自的控件，即文本框，下拉列表。



这是我之前处理过单元格编辑/更新的代码。



代码：< br $> b $ b

 $（ document ）。ready（ function （）{
 
  var  tab = $（'  ＃myDataTable'）。dataTable（{
 
  < span class =code-string> oTableTools：
 {
   sSwfPath：  ../../ Content / copy_cvs_xls_pdf.swf 
}，
   b处理： true ，
   bServerSide： true ，
   sAjaxSource：'  DataProvider'，
   bJQueryUI： true ，
   sDom：' <HTCfr> t<Fip>'，
   oTableTools：{
   aButtons：[
 {
   sExtends：  copy_to_div，
   sButtonText： 复制到div，
  < span class =code-string> sDiv：  copy，
} 
] 
}，
 
   aoColumns：[
 {
   sName：  ID 
，  bVisible： false  
 
}， 
 {  sName：  COMPANY_NAME，  sClass ：  hidden-xs，
    fnRender： function （oObj）
 { return  ' < a href = \Home / Details /' + oObj.aData [ 0 ] + '  \ >' + oObj.aData [ 1 ] + ' < / A>'; 
} 
}，
 {  sName：  ADDRESS}，
 {  sName：  TOWN}  //  这将是下拉列表假设]  
}）; 
 
   //  这将不再有用我猜:(伤心  
 tab.makeEditable（{
   aoColumns ：[
 
  null ，
  null ，
 {
指标：' 保存...'，
工具提示：' 点击选择城镇，
 loadtext：'   loading ...'，
 type：' 选择'，
 onblur：'  submit'， 
 loadurl： '  AjaxDataProvider1' 
 
}] 
}）; 
}）; 
 
< / script> 

PS：列编辑后的数据到达控制器意味着我可以做任何事情。我一直在尝试4-5小时仍然没有线索:(

只需3列以上（文字，文字，下拉列表）+一个编辑链接列.. ..



以下是我试过的链接，请看一下并分享您的想法：

https://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html [ ^ ]



http://datatables.net/media/blog/inline-editing/complete.html [ ^ ]



关注

解决方案

（ document ）。ready（ function （）{

var tab =

（' ＃myDataTable'）。dataTable（{

oTableTools：
{
sSwfPath： ../../ Content / copy_cvs_xls_pdf.swf
}，
bProcessing： true ，
bServerSide： true ，
sAjaxSource：' DataProvider'，
bJQueryUI： true ，
sDom：' < HTCfr> t<Fip>'，
oTableTools：{
aButtons：[
{
sExtends： copy_to_div，
sButtonText ： 复制到div，
sDiv： copy，
}
]
}，

aoColumns：[
{
sName： ID
， bVisible： false

}，
{ sName ： COMPANY_NAME， sClass： hidden-xs，
fnRender ： function （oObj）
{ return ' < a href = \Home / Details /' + oObj.aData [ 0 ] + ' \>' + oObj.aData [ 1 ] + ' < / a>';
}
}，
{ sName： ADDRESS}，
{ sName： TOWN} // 这将是下拉列表假设]
}）;

// 这将不再有用我猜:(伤心
tab.makeEditable（{
aoColumns ：[

null ，
null ，
{
指标：' 保存...'，
工具提示：' 点击选择城镇，
loadtext：' loading ...'，
type：' 选择'，
onblur：' submit'，
loadurl： ' AjaxDataProvider1'

}]
}）;
}）;

< / script>

PS：列编辑后的数据到达控制器意味着我可以做任何事情。我一直在尝试4-5小时仍然没有线索:(

只需3列以上（文字，文字，下拉列表）+一个编辑链接列.. ..



以下是我试过的链接，请看一下并分享您的想法：

https://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html [ ^ ]



http://datatables.net/media/blog/inline-editing/complete.html [ ^ ]



问候

你应该实现一个Keytable ..



下面是一个例如。





https：/ /editor.datatables.net/tutorials/keytable [ ^

Hi
Now i am screwed i have to change my entire functionality of datatable .

Now what i need is i need to have a edit link as a column on every row of data-table . when i click on edit the columns should turn to respective controls i.e text-boxes,drop-downs .

This is my code where i previously dealt with cell wise editing/updating .

CODE:

 $(document).ready(function () {

        var tab = $('#myDataTable').dataTable({
            
                    "oTableTools":
                    {
                        "sSwfPath": "../../Content/copy_cvs_xls_pdf.swf"
                    },
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": 'DataProvider',
            "bJQueryUI": true,
            "sDom": '<"H"TCfr>t<"F"ip>',
            "oTableTools": {
                "aButtons": [
                    {
                        "sExtends": "copy_to_div",
                        "sButtonText": "Copy to div",
                        "sDiv": "copy",
                    }
                ]
            },

            "aoColumns": [
                         {
                             "sName": "ID"
                             , "bVisible" : false
                            
                         },
                         { "sName": "COMPANY_NAME",  "sClass": "hidden-xs" ,
                          "fnRender": function(oObj)
                             {  return '<a href=\"Home/Details/' + oObj.aData[0] + '\">' + oObj.aData[1] + '</a>'; 
                             }
                         },
                         { "sName": "ADDRESS" },
                         { "sName": "TOWN" }   //this will be drop-down assume             ]   
        });
      
//This will be useful no more i guess :( sad 
        tab.makeEditable({
            "aoColumns": [
 
                null,
                null,
                {
                indicator: 'Saving...',
                tooltip: 'Click to select town',
                loadtext: 'loading...',
                type: 'select',
                onblur: 'submit',
                loadurl: 'AjaxDataProvider1'

            }]
        });
    });

</script>

PS: Once column edited data Reached controller means i can do everything . I am trying from 4-5 hours continuously still i have no clue :(
Simply above 3 columns(text,text,dropdown) + one edit link column .. ..

Here are the links i tried please once look at this and share you ideas :
https://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html[^]

http://datatables.net/media/blog/inline-editing/complete.html[^]

Regards

解决方案

(document).ready(function () { var tab =

('#myDataTable').dataTable({ "oTableTools": { "sSwfPath": "../../Content/copy_cvs_xls_pdf.swf" }, "bProcessing": true, "bServerSide": true, "sAjaxSource": 'DataProvider', "bJQueryUI": true, "sDom": '<"H"TCfr>t<"F"ip>', "oTableTools": { "aButtons": [ { "sExtends": "copy_to_div", "sButtonText": "Copy to div", "sDiv": "copy", } ] }, "aoColumns": [ { "sName": "ID" , "bVisible" : false }, { "sName": "COMPANY_NAME", "sClass": "hidden-xs" , "fnRender": function(oObj) { return '<a href=\"Home/Details/' + oObj.aData[0] + '\">' + oObj.aData[1] + '</a>'; } }, { "sName": "ADDRESS" }, { "sName": "TOWN" } //this will be drop-down assume ] }); //This will be useful no more i guess :( sad tab.makeEditable({ "aoColumns": [ null, null, { indicator: 'Saving...', tooltip: 'Click to select town', loadtext: 'loading...', type: 'select', onblur: 'submit', loadurl: 'AjaxDataProvider1' }] }); }); </script>

PS: Once column edited data Reached controller means i can do everything . I am trying from 4-5 hours continuously still i have no clue :(
Simply above 3 columns(text,text,dropdown) + one edit link column .. ..

Here are the links i tried please once look at this and share you ideas :
https://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html[^]

http://datatables.net/media/blog/inline-editing/complete.html[^]

Regards

You should implement a Keytable..

Below is an example.


https://editor.datatables.net/tutorials/keytable[^]

这篇关于DataTable内联编辑？ jquery数据表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！