SitePoint Sponsor

User Tag List

Results 1 to 7 of 7

Thread: modify table

  1. #1
    SitePoint Addict
    Join Date
    Dec 2009
    Posts
    301
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    modify table

    I have a javascript var temp ;


    var temp= "<table><tr><td><input type="text" name="source0" value="" /></td></tr></table>" ;

    I want to modify the contents of temp. I want to modify the value of "name" field . ( // red marked)

    How to modify the contents of temp variable ?

    I want an output:
    temp= "<table><tr><td><input type="text" name="source1" value="" /></td></tr></table>" ;

    Looking for a jquery solution.

  2. #2
    SitePoint Addict
    Join Date
    Dec 2005
    Posts
    336
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Per the jQuery docs: http://api.jquery.com/attribute-equals-selector/

    $('input[name="source0"]').attr('name', 'source1');

  3. #3
    SitePoint Addict
    Join Date
    Dec 2009
    Posts
    301
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks. But that is not going to work. Thats because I can not use that on a temp variable ....Can we ? How ?

    You got confused. Could you please go through my question again...more specifically input and output.


    Here is once again my desired input and output ....I want something like this ...

    input:
    var temp= "<table><tr><td><input type="text" name="source0" value="" /></td></tr></table>" ;

    output:
    var temp= "<table><tr><td><input type="text" name="source1" value="" /></td></tr></table>" ;

  4. #4
    SitePoint Addict
    Join Date
    Dec 2005
    Posts
    336
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    If you just want to modify the temp var:
    HTML Code:
    var temp = '<table><tr><td><input type="text" name="source0" value="" /></td></tr></table>';
    if (temp.indexOf('source0') !== -1) {
        temp = temp.replace('source0', 'source1');
    }
    Nothing needed for jQuery.

    But, if you already put the temp var in the DOM, now we can use the jQuery solution above:
    HTML Code:
    <form></form>
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
    <script>
    	$(document).ready(function(){
    		var temp = '<table><tr><td><input type="text" name="source0" value="" /></td></tr></table>';
    
    		$('form').append(temp);
    		$('input[name="source0"]').attr('name', 'source1'); 
    	});
    </script>

  5. #5
    SitePoint Addict
    Join Date
    Dec 2009
    Posts
    301
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    first approach looks OK.

    second approach is not acceptable. because , I'm planning to use this for a dynamic row creation kind of staff . that requires target names to be different than source names. If I follow your second approach, then that will alter the name of source name also.


    I am planning to create a dynamic row addition in a table. but those will have input text box, select box in them. I want to make sure that all those elements gets different names and ids.

    do you have a better code ?

  6. #6
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,820
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Tables have their own set of DOM commands for adding, updating, and deleting table elements.

    You should never need to put HTML tags in your JavaScript if you are intending to update the DOM. You can only ever use HTML tags in code that you are going to insert into the web page using innerHTML where you will never need to update parts of it afterwards. You can't use innerHTML on parts of a table and so to update parts of a table you either need to use the general DOM calls or the table specific ones.

    See http://javascriptexample.net/domtable.php for some info on the DOM table commands.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  7. #7
    SitePoint Addict
    Join Date
    Dec 2005
    Posts
    336
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by windowsxp View Post
    I am planning to create a dynamic row addition in a table. but those will have input text box, select box in them. I want to make sure that all those elements gets different names and ids.
    Great, now I can't say 'do you have a better explanation of what you need?' now can I?

    do you have a better code ?
    Where is code that you are attempting now?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •