Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > Web Programming > JavaScript > BOOK: Beginning JavaScript
Password Reminder
Register
Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
BOOK: Beginning JavaScript
This is the forum to discuss the Wrox book Beginning JavaScript by Paul Wilton; ISBN: 9780764544057
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Beginning JavaScript section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developersí questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Display Modes
  #1 (permalink)  
Old January 13th, 2006, 01:48 PM
Friend of Wrox
Points: 1,243, Level: 13
Points: 1,243, Level: 13 Points: 1,243, Level: 13 Points: 1,243, Level: 13
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Oct 2003
Location: , , United Kingdom.
Posts: 290
Thanks: 24
Thanked 0 Times in 0 Posts
Default EDIT AND TAB IN TABLE

Hi,
I cannot figure out how to make a row in a table editable with javascript.

When they click the edit button (found in last td in table please see below) I would like to place the cursor in the first cell of the row and allow user to edit the value already in the cell. Also, the first button should change to an ok button and the second to a cancel button.

Then when user clicks the tab key they would move to the next cell in the same row and edit it and so on.

No other key should work because the user is only allowed to to leave editable mode when he clicks the cancel button.

This is what I have done so far and would appreicate your help and input.

Cheers

<script>
function editRow(el)
{
var im1 = document.getElementById("imEdit")
var im2 = document.getElementById("imDel")

im1.src = "ok.gif"
im2.src = "cancel.gif"

c=el.innerHTML// get the current content of the cell
    inp=document.createElement("input")
    inp.type="text"
    inp.className="inpWght"
    inp.value=c
    inp.size="3"
    inp.onblur=function(){closeEdit(this)}
    el.removeChild(el.firstChild)
    el.appendChild(inp)
    inp.focus()


}
</script>

<table border="1" class="grdMain" id="tblAdVersions" border="0" cellpadding="0" cellspacing="1">
<tbody>
<tr id="tr1">

    <td> <nobr>
    <div title="RLPX00041" style="width: 150px; overflow: hidden;"> RLPX00041 </div>
    </nobr> </td>

    <td> <nobr>
    <div title="RE212921" style="width: 185px; overflow: hidden;"> RE212921 </div>
    </nobr> </td>

    <td> <nobr>
    <div title="Rebif Across America" style="width: 200px; overflow: hidden;"> To be defined </div>
    </nobr> </td>

    <td> <nobr>
    <div title="Actions" style=""> <img id="imEdit" title="edit" style="cursor: pointer;" onclick="editRow(this)" src="../App_Themes/theme1/buttons/pencil3.png"> † <img id="imDel" title="delete" style="cursor: pointer;" onclick="delNode('1')" src="../App_Themes/theme1/buttons/del.png"> </div>
    </nobr> </td>

</tr>

</tbody>
</table>

Reply With Quote
  #2 (permalink)  
Old January 21st, 2006, 04:29 AM
Friend of Wrox
 
Join Date: Oct 2004
Location: delhi, delhi, India.
Posts: 553
Thanks: 0
Thanked 1 Time in 1 Post
Send a message via MSN to vinod_yadav1919 Send a message via Yahoo to vinod_yadav1919
Default

Hi Pallone!!
Visit the link for your solution

http://p2p.wrox.com/topic.asp?TOPIC_ID=38697
 Hope this will help you :)

Cheers :)

vinod
Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
Edit Access Table in Excel (2003) kewldude_3001 Access 0 April 10th, 2008 02:26 PM
Edit Table through a Form Coby Access VBA 3 August 17th, 2007 07:10 AM
CH 6 (edit the table) mekanaren BOOK: Beginning PHP5, Apache, and MySQL Web Development ISBN: 978-0-7645-7966-0 0 October 27th, 2006 09:40 AM
TAB AND EDIT pallone Javascript How-To 5 January 27th, 2006 07:18 PM
Edit value from Table acdsky Classic ASP Databases 1 June 28th, 2004 10:11 PM



All times are GMT -4. The time now is 07:58 AM.


Powered by vBulletin® Version 3.7.0
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.