Solved

Kendo grid filed with href

Posted on 2014-09-16
4
552 Views
Last Modified: 2014-09-22
My Kendo grid has "Add New" button with the function:
 me.filter.add(function () {
                        //Open the page used to add a new CallLog
                        app.router().navigate("/CallCenter/Call", true);
This works.

Here is my grid:
me.grid = me.gridContainer.kendoGrid({
                        dataSource: me.dataSource,
                        selectable: false,
                        sortable: true,
                        filterable: true,
                        pageable: true,
                        columns: [
                            { title: "Inquiry #", filterable: true, field: "CallId", width: 120 }, (1)
                           // { title: "Inquiry #", filterable: false, field: "CallId", template: kendo.template($("#" + TEMPLATE_CALLLOGS_NAME).html()) },
                           { title: "Property Code", filterable: true, field: "PropertyCode" },
                            { title: "Property Name", filterable: true, field: "PropertyName" },
                            { title: "Contract", filterable: true, field: "ContractCode" }
}
When grid populates with the data the Inquiry# column displays some content.  I need to replace the underlined column "Inquiry#" with the one directly following it that uses  TEMPLATE_CALLLOGS_NAME
I need help to create TEMPLATE_CALLLOGS_NAME script so it opens the same form.
Something like this:
<script type="text/x-kendo-template" id="template_calllog_calllogname">
    <a href="/CallCenter/Call/">
    </a>
</script>
If I use the script I am showing here, that content of the "Inquiry#" column does not show and now Href links also.

Please help.
0
Comment
Question by:Aquarus
  • 3
4 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 40327201
could you provide link to your page ?

try this :
var cellOfInquiryTitle = $("td:contains('Inquiry #')");
var rowOfTitles = cellOfInquiryTitle.closest("tr");
var rows = rowOfTitles.nextAll("tr");
$("td:first", rows).each(function() {
    $("a", this).click(function(evt) {
           evt.preventDefault();
           var href = $(this).attr("href");
           $(this).closest("td").next().load(href);
    });
});

Open in new window

0
 

Author Comment

by:Aquarus
ID: 40327898
The link to the page that  works was in the description of my question.  I am sorry it did not come out clearly.  

"My Kendo grid has "Add New" button with the function:
  me.filter.add(function () {
                         //Open the page used to add a new CallLog
                         app.router().navigate("/CallCenter/Call", true);
 

I have the template script like this:
<script type="text/x-kendo-template" id="template_calllog_calllogname">
    <a href="/CallCenter/Call/">
    </a>
</script>

How should I put what you suggested in this script and where is the link to my "/CallCenter/Call" form?
0
 

Accepted Solution

by:
Aquarus earned 0 total points
ID: 40328205
This is the correct script for template.
 script type="text/x-kendo-template" id="template_calllog_calllogname">
     <!--<a href="/CallCenter/Call/">-->
    <a href="/CallCenter/Call/#: CallHeaderID #" title="Open Call" data-id="link">#: CallId #</a>
     
</script>
0
 

Author Closing Comment

by:Aquarus
ID: 40336152
This information is only for newbies who wants to learn step by step and knowledge-wise only at the beginning of the learning.
0

Featured Post

What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

Join & Write a Comment

Wouldn’t it be nice if you could test whether an element is contained in an array by using a Contains method just like the one available on List objects? Wouldn’t it be good if you could write code like this? (CODE) In .NET 3.5, this is possible…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

706 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now