Spell check for grid

[Zash]

We tried to check the spelling for data item inside Grid.
How do we fire up spelling control when we click update button of grid?
Here is the following code modified from your example:

GridEditableItem editedItem = (e.Item as GridEditableItem);

                        LinkButton actionButton;

                        //insert mode

                        if (editedItem.OwnerTableView.IsItemInserted)

                        {

                            actionButton = editedItem.FindControl("PerformInsertButton") as LinkButton;

                        }

                        //edit mode

                        else

                        {

                            actionButton = editedItem.FindControl("UpdateButton") as LinkButton;

                        }

                        actionButton.OnClientClick = "return StartCheck();";

                        HiddenField1.Value = actionButton.ClientID;

                        IGridColumnEditor editor = editedItem.EditManager.GetColumnEditor("Comment");

                        string editorID = editor.ContainerControl.Controls[1].ClientID;

                        RadSpell1.ControlsToCheck = new string[1] { editorID };

                        RadSpell1.IsClientID = true;

[Rumen]

Hello Zash,

I modified the code of the Spell Check RadGrid editors demo as the provided code and I was able to launch the spellchecker by clicking on the link update button. You can see my test in the following video: http://screencast.com/t/BqFKQPo0U3.

Kind regards,
Rumen
the Telerik team

[Zash]

By your code I can fire spelling check control.  Now I have another problem.  In my grid, data input is a radtexteditor in a template column.  Althought I can find this textbox client and assigned it to spelling control "controlstocheck" property, and spelling control can't find this textbox and give me an error "cannot find text source...".  I open "view source" of my page and I cannot find this textbox by its client id eigher.  My question is how to check spelling to a textbox in a template column.

[Zash]

I post previous request several days and I am still waiting for your reply.  The problem is I need to check spelling of a text editor inside a grid template column.  Spelling check control can not find the text editor control by its client id.

[Rumen]

Hello Zash,

Please, find attached an example demonstrating the requested functionality.

Regards,
Rumen
the Telerik team

[Zash]

your example code works fine in i.e but does not work in non i.e like Safari 5.0, Firefox

The probelm is in the following function,  document.getElementById(buttonID) not being supported by Safari or Firefox browser

because document.getElementById(buttonID) does not return object.

What would be the work around for it in Safari?

 

 

 

 

function SpellCheckClosed(sender, args) {

 

 

 

 

if (IsChecked) {

 

 

 

 

//trigger submit from the update/insert button in the grid

 

 

 

 

 

 

 

 

 

 

//the id of the update or insert button is extracted from a hidden field

 

 

 

 

 

 

 

 

 

 

var buttonID = document.getElementById('<%=HiddenField1.ClientID %>').value;

 

 

document.getElementById(buttonID).click();  /// not being supported by non i.e like Safari and firefox

 

IsChecked =

 

false;

 

 

}

 

}

Thanks

[Zash]

Hello ,

We have already gone live and we found spell check not working in other browser like Safari and firefox. In earlier latest post i provided my code, document.getElementById(buttonID).click(), where it  breaks and freezes up.

If you could tell me what am i  doing wrong, i will appreciate it.

Thanks a lot.

[Rumen]

Hi Zash,

This is a browser behavior. You can find information how to fix it in the following article: Fix for Firefox click() event issue as well as alternative for .click() method in firefox.

function SpellCheckClosed(sender, args)
{
    if (IsChecked)
    {
        //trigger submit from the update/insert button in the grid
        //the id of the update or insert button is extracted from a hidden field
        var buttonID = document.getElementById('<%=HiddenField1.ClientID %>').value;
        //document.getElementById(buttonID).click();
        if ($get(buttonID).dispatchEvent) {
            var e = document.createEvent("MouseEvents");

            e.initEvent("click", true, true);
            $get(buttonID).dispatchEvent(e);

        }

        else {
            $get(buttonID).click();

        }
        IsChecked = false;
    }
}

See also this Mozilla's article: https://developer.mozilla.org/en/DOM/element.click.

All the best,
Rumen
the Telerik team

[Zash]

Hello,

Your  example code

function SpellCheckClosed(sender, args)

{

 

}
works fine in safari and i.e. but still issue with FireFox/windows. When i tried to insert item from Grid , after clicking on insert link,spellchecks fire and after spelling check is completed it does not do postback and hence inserted item does not get saved in database. However if i click cancel link it does postback.

I tried with alternate solution. Using ASP Button not LinkButton but if i do that it could not find control then. It comes null.

Thanks,

[Zash]

you have also suggested to do alternative workaround(s):

Workaround 1:

Instead of using a LinkButton control, use a Button control instead. Firefox does support the click() event for input type=button HTML controls. So you could change the code to this:

<asp:Button ID="btnMyButton" runat="server" />

<a href="#" onclick="document.getElementById('btnMyButton').click();">Click this to click the other button!</a>

Can i change linkbutton to Asp Button? Do you have an example code for that?

Workaround 2:

If you can’t change the element to a Button control instead of a LinkButton, you can simulate the postback event by calling the method that .NET calls in the background when you click on the LinkButton control directly. This event is called __doPostBack() and takes the ID name of the control that you want to cause a postback. So you could change the code to this:

<asp:LinkButton ID="lnkMyButton" runat="server">My Button To Click</asp:LinkButton>

<a href="#" onclick="__doPostBack('lnkMyButton', '');">Click this to click the other link!</a>

How can i modify your example code:
function SpellCheckClosed(sender, args)
{
    if (IsChecked)
    {
        //trigger submit from the update/insert button in the grid
        //the id of the update or insert button is extracted from a hidden field
        var buttonID = document.getElementById('<%=HiddenField1.ClientID %>').value;
        //document.getElementById(buttonID).click();
        if ($get(buttonID).dispatchEvent) {
            var e = document.createEvent("MouseEvents");

            e.initEvent("click", true, true);
            $get(buttonID).dispatchEvent(e);

        }

        else {
            $get(buttonID).click();

        }
        IsChecked = false;
    }
}
how do i simulate postback that .NET calls in background, __doPostBack()? Because after spell check is completed

call does not return to serverside to click on insert link.

[Rumen]

Hi Zash,

Here is how to modify the SpellCheckClosed function to solve the Firefox problem:

            function SpellCheckClosed(sender, args) {
                if (IsChecked) {
                    //trigger submit from the update/insert button in the grid
                    //the id of the update or insert button is extracted from a hidden field
                    var buttonID = document.getElementById('<%=HiddenField1.ClientID %>').value;
                    if ($telerik.isIE) {
                        document.getElementById(buttonID).click();
                    }
                    else {
                        eval($get(buttonID).href.replace("javascript:",""));
//                        HTMLElement.prototype.click = function() {
//                            var evt = this.ownerDocument.createEvent('MouseEvents');
//                            evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
//                            this.dispatchEvent(evt);
//                        }
//                        //alert(document.getElementById(buttonID).click);
//                        document.getElementById(buttonID).click();
                    }
                    IsChecked = false;
                }
            }

Regards,
Rumen
the Telerik team