模板的工作剑道电网coloums [英] Working on templates for coloums in kendo grid

查看:185
本文介绍了模板的工作剑道电网coloums的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在努力,如果与其他在kendoGrid.I领域中的一个的模板有两个字段StatusDesc和newStatusDesc来使用。我想表明的值作为一个锚标记之一。这是显示正常,但如果你注意到的onclick锚标记定义,它具有从电网本身,因为它打开另一个网页,但是当我锚标记上单击领域之一,我的浏览器的控制台显示:

 未捕获的Ref​​erenceError:未定义WEW6101

其实如果我检查萤火虫,它显示了以下值集
我的定位标记的参数是正确的,但
我不能调用该函数WEW6101

 的onclick ='openStatusReload(WEW6101)  $(#网格)。kendoGrid({
        数据源:TUEDataSource,
        autoBind:假的,
        滚动:假的,
        排序:{
            allowUnsort:假的
        },
        //过滤:{模式:行,作风:最大宽度:100像素; },
        // groupable:真实,
        分页:{
            刷新:真实,
            buttonCount:5,
            页面大小:5
        },
        数据绑定:gridDataBound,
        列:
            [
                {场:newStatusDesc,隐藏的:真正},
            {场:StatusDate,标题:状态日期,宽度:200,格式为:{0:MM / DD / YYYY},过滤:{细胞:{showOperators:假的,suggestionOperator:包含}}} ,
            {场:状态,标题:状态,宽度:150,过滤:{细胞:{showOperators:真正}}},
            {场:LimitedDate,标题:截止日期,格式为:{0:MM / DD / YYYY},宽度:150,过滤:{细胞:{showOperators:真正}}},
            {
                现场:StatusDesc,标题:注释,宽度:150,
                模板:('!&放大器;&安培; newStatusDesc ='StatusDesc ==''和;&安培; newStatusDesc!= NULL)#如果{#< A HREF =JavaScript的:无效(0)类='保证金right10 的onclick ='openStatusReload(#= newStatusDesc#),'>#:newStatusDesc#< / A>#}其他{##:StatusDesc ##}#,过滤:{细胞:{showOperators:真正}}
                //模板:< A HREF =JavaScript的:无效(0)类='保证金right10的onclick ='openPlayerTUEStatusReload(#= Tue_StatusDesc#),'>#= TueStatusDesc#< / A>中,过滤:{细胞:{showOperators:真正}}
            },
            ]
    });


解决方案

根据@ Quantastical的评论你缺少在你的文字引号这是什么原因造成的问题,但下面的答案可能帮助这和任何未来模板您需要剑道电网做。

我觉得这个道场可以帮助你: http://dojo.telerik.com/AVeBU

像这样的

我觉得做内联模板可能很难让preFER提取方法出来,或者使用一个模板引擎喜欢剑道规定或工艺的HTML像你这样做。

我已经做了如下修改你的专栏所以从你所提供的:

  {场:StatusDesc,标题:注释,宽:130px
   模板:#= generateLink(数据)#}

在这里,我传递的DataItem的行到一个名为generateLink函数调用该code:

 函数generateLink(数据){
  VAR RET ='';  如果(data.StatusDesc ===''和;&安培; data.newStatusDesc ==!''和;&安培;!data.newStatusDesc == NULL){    变种linkElement ='openStatusReload('+ data.newStatusDesc +)';    RET =< A HREF =JavaScript的:无效(0)类='保证金right10的onclick ='+
           linkElement +'>中+ data.newStatusDesc +'< / A>';    的console.log(RET);  }其他{
    RET = data.StatusDesc;
  }  返回RET;
}

这一切都为适用你有相同的逻辑,但允许你使用本地 JavaScript的,而不是国米preT的突破与剑道小部件< STRONG>#= {一些JavaScript在这里}#

这样,如果你需要修改code更容易阅读和修改,而不是找出哪个#可能会丢失。

在我的例子,我有code只是弹出与传入的值一个提示框,并登录到控制台,以便可以看到魔术正在发生。

希望这会帮助,但如果你什么改变/更好的解释让我知道,我会相应地更新我的答案。

I have been trying to use if and else in a template of one of the field in kendoGrid.I have two fields "StatusDesc" and "newStatusDesc". I want show one of the value as an anchor tag. That is displaying fine but if you notice onclick defined for anchor tag,it has one of the field from the grid itself because it has to open a another page but when i click on the anchor tag, console of my browser shows:

uncaught ReferenceError: WEW6101 is not defined

Actually if I check firebug, it shows below value set to my anchor tag parameter which is correct but I am not able to call the function "WEW6101"

onclick='openStatusReload(WEW6101)



  $("#Grid").kendoGrid({
        dataSource: TUEDataSource,
        autoBind: false,
        scrollable: false,
        sortable: {
            allowUnsort: false
        },
        //filterable: { mode: "row", style: "max-width:100px;" },
        //groupable: true,
        pageable: {
            refresh: true,
            buttonCount: 5,
            pageSizes: 5
        },
        dataBound: gridDataBound,
        columns:
            [
                { field: "newStatusDesc", hidden: true },
            { field: "StatusDate", title: "Status Date", width: 200, format: "{0:MM/dd/yyyy}", filterable: { cell: { showOperators: false, suggestionOperator: "contains" } } },
            { field: "Status", title: "Status", width: 150, filterable: { cell: { showOperators: true } } },
            { field: "LimitedDate", title: "Expiration Date", format: "{0:MM/dd/yyyy}", width: 150, filterable: { cell: { showOperators: true } } },
            {
                field: "StatusDesc", title: "Comments", width: 150,
                template: "#if(StatusDesc == '' && newStatusDesc!='' && newStatusDesc!= null  ) {#<a href='javascript:void(0)' class='margin-right10' onclick='openStatusReload(#=newStatusDesc#)'> #:newStatusDesc#</a>#} else{##:StatusDesc##}#", filterable: { cell: { showOperators: true } }
                // template: "<a href='javascript:void(0)' class='margin-right10' onclick='openPlayerTUEStatusReload(#=Tue_StatusDesc#)'>#=TueStatusDesc#</a>", filterable: { cell: { showOperators: true } }
            },
            ]
    });

解决方案

As per @Quantastical's comment you are missing the quotes around your text which is what is causing the issue but the below answer may help with this and any future templating you need to do with the kendo grids.

I think this dojo may help you out: http://dojo.telerik.com/AVeBU

I find doing inline templating like this can be difficult so prefer to extract the method out and either use a templating engine like kendo provides or craft the html like you have done.

I have made the following changes to your column so from what you have provided to:

 { field: "StatusDesc", title: "Comment", width: "130px" ,
   template: "#=generateLink(data)#" }

Here I am passing the dataItem for the row into a function called generateLink which calls this code:

function generateLink(data) {
  var ret = '';

  if (data.StatusDesc === '' && data.newStatusDesc !== '' && data.newStatusDesc !== null) {

    var linkElement = 'openStatusReload("' + data.newStatusDesc + '")';

    ret = "<a href='javascript:void(0)' class='margin-right10' onclick='" +
           linkElement + "'>" + data.newStatusDesc + '</a>';

    console.log(ret);

  } else {
    ret = data.StatusDesc;
  }

  return ret;
}

all this does is applies the same logic you had but allows you to use native javascript rather than the kendo widgets having to interpret the breakouts with the #= {some javascript in here} #

this way if you need to modify the code it is easier to read and change rather than having to figure out which # may be missing.

In my example I have the code just popping up an alert box with the value passed in and logging to console so you can see the magic that is occurring.

Hope this helps but if you anything changing/explaining better let me know and I will update my answer accordingly.

这篇关于模板的工作剑道电网coloums的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆