数据表应该相应改变？ MVC4 [英] Data table should change accordingly ? MVC4

问题描述

您好b $ b

图片来源： http://tinypic.com/view.php?pic=ev5ma9&s=8#.U1WAufmSxf4



在这里找到图像： http：/ /i59.tinypic.com/ev5ma9.jpg [ ^ ]



试试这个托管不同网站的图片： http：/ /postimg.org/image/mhdfa4fwx/2e9661ca/ [ ^ ]



图像内容：带有下拉列表的数据表，在我的主视图中有3个列表项（下拉列表出现在非常类似于sdom工具栏）.. Onload Datatable有完整的数据列表，间接成为我的第一个Listitem。

当选择第二个列表项时：数据表数据应该在下拉列表中的选择更改时更改，可能与第3个列表相同项目。



我需要的是在我下面提到的代码中只有一个ajax源代码？那么，如何将我的dropdwon选择传递给AJAXSOURCE？ ？





我的jquery数据表代码：

< script type =   text / javascript> 
 
 $（ document ）。ready（ function （）{
 
  var  tab = $（' ＃ myDataTable'）。dataTable（{
 
   bProcessing ： true ，
   bServerSide： true ，
   sAjaxSource ：'  DataProvider'，
   bJQueryUI： true ，
   aoColumns：[
 {
   sName：  ID 
，  bVisible ： false  
 
}，
 {  sName：  COMPANY_NAME，< span class =code-string>  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：'  select'，
 onblur：'  submit'，
 loadurl：'  AjaxDataProvider1' 
}）; 
}）; 
 
 
< / script> 
 
< div  class  =  表响应> 
 
< table id =   myDataTable  class  =   table> 
< thead> 
 
< tr> 
< th> ID < /   th  >  
< th>公司名称< /   th  >  
< th>地址< /    >  
< th> Town < /  < span class =code-leadattribute> th  >  
 < /   tr  >  
 
  < /   thead  >  
 
< tbody> 
 
 < /   tbody   >  
 
 < /   table  >  
 < /   div  >  

在顶级代码中你可以找到它的ajaxsource我会通过ajax调用获取数据。但是当我在下拉菜单中选择一些东西时，我很困惑如何最初接近..任何想法都非常方便。



任何进一步的疑问请评论



关注

解决方案

（ document ）。ready（ function （）{

var tab =

< blockquote>（' ＃myDataTable'）。dataTable（{

b处理： true ，
bServerSide： true ，
sAjaxSource：' < span class =code-string> DataPr ovider'，
bJQueryUI： true ，
aoColumns：[
{
sName： ID
， bVisible ： false

}，
{ sName： COMPANY_NAME，< span class =code-string> 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：' select'，
onblur：' submit'，
loadurl：' AjaxDataProvider1'
}）;
}）;


< / script>

< div class = 表响应>

< table id = myDataTable class = table>
< thead>

< tr>
< th> ID < / th >
< th>公司名称< / th >
< th>地址< / >
< th> Town < / < span class =code-leadattribute> th >
< / tr >

< / thead >

< tbody>

< / tbody >

< / table >
< / div >

在顶级代码中你可以找到它的ajaxsource我会通过ajax调用获取数据。但是当我在下拉菜单中选择一些东西时，我很困惑如何最初接近..任何想法都非常方便。



任何进一步的疑问请评论



问候

这是一个非常好的例子..



http：// datatables.net/examples/server_side/custom_vars.html



这是你应该如何初始化，我的数据和值将是你的下拉值和控制器中的ajax方法将提供正确的数据

Hi
Source to image : http://tinypic.com/view.php?pic=ev5ma9&s=8#.U1WAufmSxf4

FIND the image here : http://i59.tinypic.com/ev5ma9.jpg[^]

Try this image hosted with different site : http://postimg.org/image/mhdfa4fwx/2e9661ca/[^]

IMAGE CONTENT : Data table with a dropdownlist with 3 list items in my Main view (dropdownlist present on verytop just like sdom toolbar).. Onload Datatable have complete list of data which indirectly be my 1st Listitem .
when 2nd list item selected : Data-table data should change on change of selection in dropdownlist likely same for 3rd list item .

What i need is there is only one ajax source right in my code mentioned below ? so, How to pass my dropdwon selection to AJAXSOURCE ? ?


Well my jquery datatable code :

<script  type="text/javascript">

    $(document).ready(function () {

        var tab = $('#myDataTable').dataTable({
           
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": 'DataProvider',
            "bJQueryUI": true,
            "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,
                {
                indicator: 'Saving...',
                tooltip: 'Click to select town',
                loadtext: 'loading...',
                type: 'select',
                onblur: 'submit',
                loadurl: 'AjaxDataProvider1'
        });
    });


</script>

<div class="table-responsive">

<table id="myDataTable" class="table" >
                    <thead >

                         <tr>
                            <th>ID</th>
                            <th >Company name</th>
                            <th>Address</th>
                           <th>Town</th>
                        </tr>
                    
                    </thead>
                        
                    <tbody> 
                       
                   </tbody>

                </table>
    </div>

On top code you can find the ajaxsource there from it i will get data via ajax call . but when i select something in dropdown i am confused how to initially approach .. Any idea is very much Handy .

Any further queries please comment

Regards

解决方案

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

('#myDataTable').dataTable({ "bProcessing": true, "bServerSide": true, "sAjaxSource": 'DataProvider', "bJQueryUI": true, "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, { indicator: 'Saving...', tooltip: 'Click to select town', loadtext: 'loading...', type: 'select', onblur: 'submit', loadurl: 'AjaxDataProvider1' }); }); </script> <div class="table-responsive"> <table id="myDataTable" class="table" > <thead > <tr> <th>ID</th> <th >Company name</th> <th>Address</th> <th>Town</th> </tr> </thead> <tbody> </tbody> </table> </div>

On top code you can find the ajaxsource there from it i will get data via ajax call . but when i select something in dropdown i am confused how to initially approach .. Any idea is very much Handy .

Any further queries please comment

Regards

Here is a very good example..

http://datatables.net/examples/server_side/custom_vars.html

Here is how you should initialise, my data and value will be your drop down value and your ajax method in controller will give the right data back

这篇关于数据表应该相应改变？ MVC4的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！