Welcome Guest Search | Active Topics | Sign In | Register

Spell Check - How to save the New information with spelling checked Options
wonder
Posted: Friday, April 9, 2010 2:06:14 AM
Rank: Newbie
Groups: Member

Joined: 4/9/2010
Posts: 6
I have refer to and used the Spell Checker control sample; Context Menu based

After pressed Spell Checker button, i can see that we are able to left-click mouse and change to appropriate correct spelling, but how are we going to save this new information into database as I notice if i were to click on an asp button, the postback will still take in the old information.

i supposed this is a simple problem to most but i really have no idea on how to get about it and need some help here.

eo_support
Posted: Friday, April 9, 2010 4:57:25 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

Context menu based Spell Checker works on static text, not input element, because ASP.NET only updates values for input element, so you will not get the new value by default.

In order to get the new value, you must add some additional JavaScript to get the new value, store it in an input element (for example, a hidden input field), then check the input field value on the server side. It will be something like this:

Code: JavaScript
function save_data()
{
    var label = document.getElementById("<%=Label1.ClientID%>");
    var input = document.getElementById("<%=Input1.ClientID%>");
    input.value = label.innerHTML;
}


Code: HTML/ASPX
<form id="form1" runat="server" onsubmit="save_data()">
    <asp:HiddenField runat="server" ID="Input1" />
    <asp:Label runat="server" ID="Label1">mispeled text</asp:Label>
    
    ...spell checker checks Label1....

    <asp:Button runat="server" ID="Save"
         Text="Save" onclick="Save_Click" />
    <asp:Label runat="server" ID="Label2"></asp:Label>
</form>


Code: C#
protected void Save_Click(object sender, EventArgs e)
{
    Label2.Text = Input1.Value;
}


The above code handles the form's onsubmit event to save Label1's new text into hidden field "Input1". When "Save" button is clicked, it gets the new value from Input1 and display it with Label2.

Hope this helps. Please feel free to let us know if you have any more questions.

Thanks
wonder
Posted: Friday, April 9, 2010 11:13:49 AM
Rank: Newbie
Groups: Member

Joined: 4/9/2010
Posts: 6
first thank you for your prompt reply. your example is clearly illustrated and simple to implement, but i still do not know-how to apply same logic using datagrid/gridview; meaning reproducing your context menu based spell checker sample and to be able to save the new content after spell-checked them.

what should i do in this case, can you kindly guide/show me? ^^
eo_support
Posted: Friday, April 9, 2010 1:19:20 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

The basic idea will be the same. You will still need to get all the new values, put them into a hidden field and get the value from the hidden field.

In order to get the new cell values, you can get the DataGrid table HTML element (A DataGrid is rendered as a table), then use table.rows[y].cells[x].innerHTML to get the cell text. Once you have the new values, you can encode them into a single string value (for example, if your cell value does not contain '|', you can concatenate all values together in the form of value1 + "|" + value2 ....). You will then decode them back to multiple values on the server side.

Thanks
wonder
Posted: Sunday, April 11, 2010 10:26:10 PM
Rank: Newbie
Groups: Member

Joined: 4/9/2010
Posts: 6
Hi eo_support,

Thx for your advice, i still couldn't get it to work, i hope i can have your patience in showing me how-to in code-wise.
Really appreciate your helpfulness.
eo_support
Posted: Sunday, April 11, 2010 10:42:01 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

Can you let us know which step you are having problem with?

Thanks
wonder
Posted: Sunday, April 11, 2010 11:47:48 PM
Rank: Newbie
Groups: Member

Joined: 4/9/2010
Posts: 6
i don't quite get it on how to render Html table back from Datagrid in asp.net, though i'm able to populate a Datagrid from Html table using HiddenField in my htmll page.

assuming my datagrid is gridviewcurrent, can i use following:
function LoopingThruGridViewCurrent()
{
var gvDrv = document.getElementById('<%= gridviewcurrentconfirm.ClientID %>');
for(j = 0; j < gvDrv.childNodes.length; j++)
{
var tBody = gvDrv.childNodes(j);
for(k=0;k < tBody.childNodes.length-1; k++)
{
var tr = tBody.childNodes(k);
for(l=0; l < tr.childNodes.length-1; l++)
{
td = tr.childNodes(2);
var test = td.childNodes(0);

test.innerHtml;
}
}
}
var input = document.getElementById('<%=Input1.ClientID%>');
input.value = test.innerHTML;
}

in my code-behind, my response.write("value = " & input1.Value) is nothing.

i would thought i would get some values, then i'll follow on your advice to concatenate strings later, but i believe i already got it wrong somehow in my javascript, can show me the right approach?


eo_support
Posted: Monday, April 12, 2010 1:21:11 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

I believe it should be something like this:

Code: JavaScript
var allText = "";

//Get the table object
var table=document.getElementById('<%=gridviewcurrentconfirm.ClientID%>');

//Loop through all cells
for (var row = 0; i < table.rows.length; row++)
{
   for (var col = 0; col < table.rows[row].cells.length; col++)
   {
       //Get the cell text on (row, col)
       var cellText = table.rows[row].cells[col].innerHTML;

       //append cell text to "allText"
       allText = allText + "|" + cellText;
   }
}

//Now you have all (corrected) cell text inside "allText", pass
//it back to server
input.value = allText;


Note the code simply concatenating all cellText together (separated by "|") to create a single value "allText". You can change that to whatever algorithm that fits your own needs. The above code only works if your cell ext does not contain "|", otherwise you will have problem to convert this single value back to its original multiple values.

Hope this helps.

Thanks
wonder
Posted: Monday, April 12, 2010 3:14:29 AM
Rank: Newbie
Groups: Member

Joined: 4/9/2010
Posts: 6
your logic seems correct, but sorry, this code seems doesn't work on your Context menu based Spell Checker sample as well, can shed some light if you are able to do so otherwise?

is it because the table object is not available?
var table=document.getElementById('<%=gridviewcurrentconfirm.ClientID%>')
i still receive nothing in input.value when i try to response.write.

by the way, ironically i always use "|" as my split separator too, 'coz i think this key is unique character that user will hardly use, though i try to put a few more, eg. #$| to make it really unique, but i found that i'll encounter problem splitting in my asp.net, have not really explore further, wonder if this is a bug in split in asp.net.

eo_support
Posted: Monday, April 12, 2010 5:10:37 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
Hi,

The above code only works for standard ASP.NET DataGrid, not GridView. For GridView there is no standard way to get the inside table because you may have other elements other than the table, such as pager, etc. In that case you should use your browser's view page source to find out the rendered HTML structure and write code based on the observed structure. In all cases you should debug your code to find out where the problem is instead of just relying on us to code or troubleshoot for you. The code we provided to you usually only demonstrates the idea.

I don't think there is a bug in the .NET string.Split function. If that was the case then other people would have found it long ago. The problem is certainly in your code.

Thanks
wonder
Posted: Monday, April 12, 2010 5:44:24 AM
Rank: Newbie
Groups: Member

Joined: 4/9/2010
Posts: 6
roger that, thank you for your much help. cheers ^^
eo_support
Posted: Monday, April 12, 2010 5:53:49 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,194
You are welcome. Good luck with your project!


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.