This is a migrated thread and some comments may be shown as answers.
initiate function for each datasource item in template
1 Answer 78 Views
This is a migrated thread and some comments may be shown as answers.
Lee
Top achievements
Rank 1
Lee asked on 30 Apr 2012, 12:22 PM
I have a datasource which I display in a listview and am using a template.  I want to be able to shorten the text of one of the datasource fields on page load and am struggling with how to do this.  Can any one point me in the right direction?  Below is what I have so far.

    <div data-role="view" data-title="Control Panel - Mobile" id="listmessages" data-init="listMessagesInit">
        <h2>Customer Messages</h2>
        <p><?php echo $unread_messages . ' - unread messages'; ?></p> <a data-align="right" data-role="button" id="markasread">Mark as read</a><a data-align="right" data-role="button" id="delete">Delete</a>
        <ul id="message_list"></ul>
    </div>
      
     
   <script id="message_list_template" type="text/x-kendo-template">
        <li class="isnew_#= isnew #" id="#= id #"><a href="/messages/view/#= id #">
           <div style="float:left; width:150px; height: 50px">#= customer_name #<br />#= created #</div>
           <div style="height: 50px" id="message_#= id #" data-bind="value:short_text(message_#= id #, #= message #)">#= message #</div>
       </a></li>
   </script>   
 
    <script>
 
     function listMessagesInit(){
          
        function short_text(id, message){
            if (message.length > 100){
             var shortText = jQuery.trim(message).substring(0, 100).split(" ").slice(0, -1).join(" ") + "...";
            } else {
             var shortText = message;
            }
             
            $(id).text(shortText);
        }
 

     function listMessagesInit(){

          var messageDataSource = new kendo.data.DataSource({
           
            transport: {
                read: "/messages/data",
                dataType: "json",

                update:function(id, isnew) {
                    url:  "/messages/markasread/" + id + "/" + isnew ;  //how should these vars be passed? like this
                    type: "POST"
                },
                destroy: {
                    url: function(id, isnew) {
                            return "/messages/delete/" + id  ;  //or like this?
                        },
                   // url: "/messages/delete/210643",
                    type: "DELETE"
                },
                parameterMap: function(options, operation) {  //not sure what this does or if I even need it
                    if (operation !== "read" && options.models) {
                        return {models: kendo.stringify(options.models)};
                    }
                }                
            },              
            error: function(e) {
                alert(e.responseText);
            },              
            schema: {
              model: {
                  id: "id",
                  fields: {
                      created: { type: "string" },
                      message: { type: "string" },
                      customer_name: { type: "string" },        
                      isnew: { type: "string" }    
                     }
                    
                 }
             },
                  
           });

          $("#message_list").kendoMobileListView({
              dataSource: messageDataSource,
              //pullToRefresh: true,
              //appendOnRefresh: true,
              style: "inset",
              template: $("#message_list_template").text()
          });
          
      

     

}

1 Answer, 1 is accepted

Sort by
0
Lee
Top achievements
Rank 1
answered on 10 May 2012, 11:15 AM
I managed to find the solution at last..

I needed to create a new field in my schema called ShortMessage and added a parse function to the Scema which manipulates the field data.  This executes before the data is read.
Asked by
Lee
Top achievements
Rank 1
Answers by
Lee
Top achievements
Rank 1
Share this question
or