我们如何在网格视图中获取telerik下拉选择更改事件

时间:2012-04-23 13:08:56

标签: asp.net-mvc-3 razor telerik

我正在我的项目中使用telerik控件,任何正文都告诉如何在telerik网格视图中获取选择更改事件,该事件可以填充插入,编辑中的多个列文本框。这是在mvc3 + razor(cshtml)。

编辑器模板代码

@model string
<table>
    <tr>
        <td>
            @(Html.Telerik().ComboBoxFor(e => e)
               .BindTo(ViewBag.pro as SelectList)
               .ClientEvents(events => events.OnChange("getproductdesc")) )
        </td>

        <td>

        </td>
        <td>
            @Html.TextBoxFor((model => model), new { id = "textbox" })

        </td>
    </tr>
</table>

<script type="text/javascript">

    function getproductdesc(e) {
       var idmodel = $(this).val();
       alert(idmodel);
       $('#textbox').val($(this).val());             
    }
</script>

网格视图代码

  @(Html.Telerik().Grid(Model)
    .Name("gdProductDetails")
    .ToolBar(commands => commands.Insert())
             .DataKeys(keys => keys.Add(c => c.Product_cd))
             .Pageable(paging =>
                    paging.PageSize(5)
                          .Style(GridPagerStyles.NextPreviousAndNumeric)
                          .Position(GridPagerPosition.Bottom))
                                   .Sortable(sorting => sorting
                    .SortMode(GridSortMode.MultipleColumn))
                    .DataBinding(databing => databing.Server()
                                      // .Select("DCProductDetails", "DeliveryChallan")
                                       .Insert("Addproduct", "DeliveryChallan")
                                       .Update("Editproduct", "DeliveryChallan")
                                       .Delete("Delete", "Home"))
    .Columns(columns =>
    {
        columns.Bound(c => c.Sl_no);/*EditorTemplateName("Product")*/
        columns.Bound(c => c.Product_cd).EditorTemplateName("product").Width(350);
        columns.Bound(c => c.Prouduc_desc).ClientTemplate("<input type='text' id='textbox'/>");        
        columns.Bound(c => c.Prod_rt);
columns.Command(commands =>
        {
            commands.Edit();
            commands.Delete();
        });
    })
  )  
</table>
</fieldset>

控制器代码

var listproduct = (from i in db.MSM_PRODUCT select i);
ViewBag.pro = new SelectList(listproduct, "PRODUCT_DESC", "PRODUCT_CD");

1 个答案:

答案 0 :(得分:0)

@model string
<table>
    <tr>
        <td>
            @(Html.Telerik().ComboBoxFor(e => e)
               .BindTo(ViewBag.pro as SelectList)
               .ClientEvents(events => events.OnChange("getproductdesc")) )
        </td>

        <td>

        </td>
        <td>
            @Html.TextBoxFor((model => model), new { id = "textbox" })

        </td>
    </tr>
</table>

<script type="text/javascript">

    function getproductdesc(e) {
       var idmodel = $(this).val();
       alert(idmodel);
       $('#textbox').val($(this).val());             
    }
</script>
grid view code

  @(Html.Telerik().Grid(Model)
    .Name("gdProductDetails")
    .ToolBar(commands => commands.Insert())
             .DataKeys(keys => keys.Add(c => c.Product_cd))
             .Pageable(paging =>
                    paging.PageSize(5)
                          .Style(GridPagerStyles.NextPreviousAndNumeric)
                          .Position(GridPagerPosition.Bottom))
                                   .Sortable(sorting => sorting
                    .SortMode(GridSortMode.MultipleColumn))
                    .DataBinding(databing => databing.Server()
                                      // .Select("DCProductDetails", "DeliveryChallan")
                                       .Insert("Addproduct", "DeliveryChallan")
                                       .Update("Editproduct", "DeliveryChallan")
                                       .Delete("Delete", "Home"))
    .Columns(columns =>
    {
        columns.Bound(c => c.Sl_no);/*EditorTemplateName("Product")*/
        columns.Bound(c => c.Product_cd).EditorTemplateName("product").Width(350);
        columns.Bound(c => c.Prouduc_desc).EditorTemplateName("Product");
        columns.Bound(c => c.Prod_rt);
columns.Command(commands =>
        {
            commands.Edit();
            commands.Delete();
        });
    })
  )  
</table>
</fieldset>
    function getproductdesc(e){        var idmodel = $(this).val();        警报(idmodel);        $( '#文本框')VAL($(本).VAL())。     }

创建一个带有文本框的编辑器模板,id将编辑器模板分配给具有视图名称的感知列,在网格视图下面写入jquery,并在$('#textboxid')下面指定值.val($(this) .VAL());