This is a migrated thread and some comments may be shown as answers.

Issues in using popup from external css

1 Answer 115 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Hema
Top achievements
Rank 1
Hema asked on 29 Nov 2012, 02:30 PM
Hi,

I am new to this kendo ui. so i am facing some issues in this. Any sort of suggestion would help me to complete this part. I am having two questions in below code

 I am having a popup class outside of kendo ui(social networking login popup) which is working fine in all parts of the page.But if i keep that class inside kendo ui, popup is not working. I want to know if kendo ui does not allow out side class to use inside it.

Other one is in the below code near user_id field can how can i use iframe in popup style to call links from different websites

<script>
   $(function() {   
                     $("#grid").kendoGrid({
                dataSource: { 
                  transport: {
                        read: "data/jobs.php"
                    },

                    
                 sort: { field: "date_created", dir: "desc" },
                    schema: {
                        data: "data",
                        total: function(response) {
                        return $(response.data).length;
                       
                    }
                    }, 
                   pageSize: 15
                  
                },
                filterable: true,
                groupable: true,
                sortable: true,
                pageable: true,
                height: "525px",
                width: "100px",
                columns: [{ field: "title",title: "Title", template: "<a id='title' href='showbill.php?id=#=data.billorder_id#'>#=title#</a>"  }, 
                             { field: "city",title: "Location"},
                           { field: "date_created", title: "bill Posted" }, 
                           
                       { field: "user_id",filterable: false,title: "Status", template: '#=Getvalue(user_id,billorder_id,bill_applied)#' }  
                // i want to know how can i use iframe to load outside link in a popup style.                                   ]
                                              });
                               }); 


                          function Getvalue(value,id,bill) {
                           
                              var mid = id;
                           if (value > '0')
                           { 
                        var   value = "Applied";
                            return "<b>"+ value + " ON "+ bill + " </b>"; 
                              
                        }
                                else {
                                  var value = "Apply"; 


// this class is not calling any popup. 
                                return "<a href="#" class="outsideclass">"+ value + " ON "+ bill + " </a>"; 

                                                 }
                              }
                        
   </script>
   

1 Answer, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 03 Dec 2012, 10:36 AM
Hello Hema,

There is a syntax error connected with the quotation marks in the return statement of the Getvalue function. Please use a combination with a single and double quotations or escape the inner ones.
return '<a href="#" class="outsideclass">'+ value + ' ON '+ bill + '</a>';

Regarding your comment "this class is not calling any popup", could you specify how you call the popup? Have in mind that the rows are not rendered right after grid initialization but when the data is received through the asynchronous read transport. Please try to bind the click of the class at the dataBound event.

How can i use iframe in popup style to call links from different websites?

I suggest using KendoUI Window widget with turned on iframe option. As an example:
$("#wnd").kendoWindow({
    content: "http://www.w3schools.com",
    iframe: true
})

As a general information instead of using standard <a> elements you may also consider using a custom command.
I hope this will help.

Regards,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Hema
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Share this question
or