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

[Solved] Issue with updating an item of the radgrid with Javascript

4 Answers 141 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Thijs van Gestel
Top achievements
Rank 1
Thijs van Gestel asked on 04 Mar 2010, 03:34 PM
Hello again, I asked for help with my radgrid programming in this topic here. This time, I have a related issue in this javascript function with the update part of it.

For reference, here's the function:
function KeyPressEnter(sender, args)  
    {  
        var $ = $telerik.$;  
        if (args.get_keyCode() != 13)  
            return;  
       
        var el = Telerik.Web.UI.Grid.GetCurrentElement(args.get_domEvent());  
       
        if (el.tagName.toLowerCase() != 'input' && el.tagName.toLowerCase() != 'textarea'return;  
          
        if (sender.get_masterTableView().get_isItemInserted())  
        {  
            var evt = args.get_domEvent();  
            //if (evt.stopPropagation) evt.stopPropagation();  
            if (evt.preventDefault) evt.preventDefault();  
            sender.get_masterTableView().insertItem();  
       
            return false;  
        }  
        var detailtables = sender.get_detailTables();  
          
        if (detailtables.length > 0) {  
            for (var i = 0; i < detailtables.length; i++){   
                if (detailtables[i].get_isItemInserted()) {  
                    var evt = args.get_domEvent();  
                    if (evt.preventDefault) evt.preventDefault();   
                    detailtables[i].insertItem();   
                      
                    return false;   
                }   
            }     
        }  
           
        if ($(el).parents("tr").attr("id") && $(el).parents("tr").attr("id") != "")  
        {  
            var evt = args.get_domEvent();  
            //if (evt.stopPropagation) evt.stopPropagation();  
            if (evt.preventDefault) evt.preventDefault();  
            sender.get_masterTableView().updateItem($(el).parents("tr")[0]);  
       
            return false;  
        }  
    }  
The part of code that updates items is made bold.

While this code in normal situation just works fine and updates my rows when pressing enter, I found a specific situation where it wouldn't work. In one detailview of my radgrid, I put some of the columns of that detailview in read only mode(in the item created event of the radgrid), so that users can only edit the specific fields of a row. It's in this detailview that the javascript generates and error when trying to use this update function. It will generate the error "object expected"  on this line:
if ($(el).parents("tr").attr("id") && $(el).parents("tr").attr("id") != ""
Further investigation reveals that it's this part: $(el) that generates the error.

After this, I tried playing around with putting columns in read only mode and using this function. I discovered that specifically, if the -first- column of a row is in read only mode when trying to use this code, it will generate an error. With any other column of that row in readonly mode it would work just fine, it's just that first column that generates the "object expected" error.

Do you have any idea how I could fix this issue without putting the first column of my detailview in edit mode?


4 Answers, 1 is accepted

Sort by
0
Veli
Telerik team
answered on 08 Mar 2010, 05:31 PM
Hi Thijs van Gestel,

If $(el) is failing, it probably means that the current target of the event somehow cannot be retrieved. Can you share some more details and sample code, please? I cannot reproduce this issue. Attaching the sample page we have been working on the previous post.

Greetings,
Veli
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Thijs van Gestel
Top achievements
Rank 1
answered on 09 Mar 2010, 03:06 PM
Hello Veli, thanks again for your help.

My problem with your sample is that I can't exactly duplicate the method I use to make the fields readonly. Let me explain.

What your sample does in the itemcreated event is, for each item under the ID column, it will retreive the textbox that's created and disables that textbox. This indeed works fine. The way that I disable the items in my radgrid though is by putting the entire column in readonly mode. That way, the radgrid won't even create a textbox for that column when you're editing an item.

The kind of code I use is something like this:
foreach (GridColumn column in e.Item.OwnerTableView.Columns) 
        { 
            if (column.UniqueName == "ID") 
            { 
                ((GridBoundColumn)column).ReadOnly = true
            } 
        } 
This doesn't work in the sample code though, since the only column in the e.Item.OwnerTableView.Columns collection is the autogenerated edit column. The columns made by the datasource method aren't retreived this way and I can't seem to get them in the ItemCreated event(or the PreRender event, for that matter)

I hope this clarifies the method I use a little better.
0
Veli
Telerik team
answered on 09 Mar 2010, 04:53 PM
Hello Thijs,

The automatically generated columns can be found in the RadGrid.MasterTableView.AutoGeneratedColumns, instead of the Columns columns collection. Additionally, the auto-generated columns cause RadGrid to fire the ColumnsCreated event for each one of them, so you can use the event handler's Column property to reference the currently created column. I believe this can help you make the first column read-only and try to reproduce the problem.

Kind regards,
Veli
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Thijs van Gestel
Top achievements
Rank 1
answered on 10 Mar 2010, 12:14 PM
Hello Veli, thanks again for you quick reply.

I've succesfully tested the scenario using the info you supplied, and discovered that having the first column in read-only was not the direct issue. So I looked further into the differences between the radgrids, and noticed the way how the assemblies of Telerik.web.UI were added to the aspx page. While your sample uses 2 script references in the script manager object to 2 javascript files within this assembly, Telerik.Web.UI.Common.Core.js and Telerik.Web.UI.Common.jQuery.js, the radgrid I'm working on has the assembly referenced by registering it to the page like so:
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

By adding the script references to my radgrid page, the update function works again, with the first column being in readonly mode and all. So, the problem is solved.

Although, it's still pretty confusing where exactly the issue lies. When I tried it the other way around, removing the script references in the sample grid and adding the assembly registering to the page as I do on my own page, the javascript update function wouldn't work at all(it made no difference if any columns were read only or disabled, it just would always throw the 'object expected' error) Why exactly the update function worked on my page without the script references, as long as you didn't put the first column in read-only, might remain a mystery.

The important thing is though, the problem is fixed, and I thank you again for your support in helping me solve this issue, Veli.



Tags
Grid
Asked by
Thijs van Gestel
Top achievements
Rank 1
Answers by
Veli
Telerik team
Thijs van Gestel
Top achievements
Rank 1
Share this question
or