SitePoint Sponsor

User Tag List

Results 1 to 25 of 25
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy inserting .. a href="javascript:void(0)".. with attribute?

    i have a problem with my link,

    in one page there are 2 forms, form input and form edit, i want to show form input and edit in different time, so i write link script, ..a href="index.php?id=1".., its works, but when i united with "javascript:void(0)", it can't works. can anybody help me?

  2. #2
    SitePoint Wizard bronze trophy Immerse's Avatar
    Join Date
    Mar 2006
    Location
    Netherlands
    Posts
    1,661
    Mentioned
    7 Post(s)
    Tagged
    1 Thread(s)
    javascript:void(0) makes the link do nothing, so it simply remove that from your URL. Or do you have a special reason why it's there?

  3. #3
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes i have, i use ..a href="javascript:void(0)" to to disable my <div id="input"> and show my <div id="edit">, but the problem is when i must show <div id="edit">, i must bring an attribut in ..a href="javascript:void(0)", how to do it?

    this is parts of the script..
    <td><a href="agenda_kerja.php?id=<?=1?>;javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='block';document.getElementById('edit').style.display='block'">edit</a></td>

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Okay, let's get back to simplifying this as much as possible.

    First, what happens when no scripting is available?
    Even with PHP running before it creates the page, <?=1?> just echos out 1.
    I've also used a class name here here in case you have multiple edit objects on the page.

    PHP Code:
    <td><a id="edit" href="agenda_kerja.php?id=1">edit</a></td
    When it comes to applying the scripting, we get the object with an id of 'edit' and attach to it the scripting that we want to want to occur when the edachieve.

    Code javascript:
    document.getElementById('edit').onclick = handleEditClick;

    That handleEditClick function is where we specify the commands that we want to occur, and then return false from the event to prevent the web browser's default behaviour of following the link.

    Code javascript:
    function handleEditClick() {
        document.getElementById('light').style.display = 'none';
        document.getElementById('fade').style.display = 'block';
        document.getElementById('edit').style.display = 'block';
        return false;
    }

    You can even combine those two parts together, and perhaps even refer to the edit link via the this keyword, which refers to the element that triggered the event.

    Code javascript:
    document.getElementById('edit').onclick = function () {
        document.getElementById('light').style.display = 'none';
        document.getElementById('fade').style.display = 'block';
        this.style.display = 'block';
        return false;
    };
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank's mr. paul_wilkins. ^_^

  6. #6
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    mr., it still doesn't works..
    my <div id=edit></div> didn't want to show..?!

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    mr., it still doesn't works..
    my <div id=edit></div> didn't want to show..?!
    Can you show us a test page that demonstrates the problem?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i still use it in localhost..

    here the link,
    <td><a id="a" href="javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='block';document.getElementById('edit').style.display='block'">edit</a></td>

    here the div..
    <div id="light" class="white_content">
    test
    </div>
    <div id="edit" class="white_content">
    form edit page
    </div>
    <div id="fade" class="black_overlay"></div>

    i want to bring an attribut in "form edit page" edit my database..

  9. #9
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    i want to bring an attribut in "form edit page" edit my database..
    It seems that you've ignored what I gave you before. I don't think that I can be of much further help.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  10. #10
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i've done your answer mr., but it still doesn't works..

  11. #11
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i write this script..
    <script type="text/javascript">
    document.getElementById('a').onclick = function () {
    document.getElementById('light').style.display = 'none';
    document.getElementById('fade').style.display = 'block';
    this.style.display = 'block';
    return false;
    };
    then i wrote this link,
    <td><a id="edit" href="agenda_kerja.php?id=<?=$agenda['no_job']?>">edit</a></td>

    but it still doesn't works..

  12. #12
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <script type="text/javascript">
    document.getElementById('edit').onclick = function () {
    document.getElementById('light').style.display = 'none';
    document.getElementById('fade').style.display = 'block';
    this.style.display = 'block';
    return false;
    };

  13. #13
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    This is some simple test code showing how it works.

    Code html:
    <html>
    <head>
    </head>
    <body>
    <a id="editlink" href="agenda_kerja.php?id=1">edit</a>
     
    <div id="light" class="white_content">
    test
    </div>
    <div id="edit" class="white_content">
    form edit page
    </div>
    <div id="fade" class="black_overlay"></div>
    <script>
    function handleEditClick() {
        document.getElementById('light').style.display = 'none';
        document.getElementById('fade').style.display = 'block';
        document.getElementById('edit').style.display = 'block';
        return false;
    }
     
    document.getElementById('editlink').onclick = handleEditClick;
    </script>
    </body>
    </html>
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  14. #14
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes mr., it's works, but the attribute "id=1" didn't follow to ..

    <div id="edit" class="white_content">
    form edit page
    <?
    $id = $_GET['id'];
    ?>
    </div>

  15. #15
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    yes mr., it's works, but the attribute "id=1" didn't follow to ..
    What relevance does that have?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  16. #16
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    here my complete <div id="edit" class="white_content"></div>

    <div id="edit" class="white_content">
    <?
    $id = $_GET['id'];
    $edit_agenda_sql=mysql_query("select * from plan_kerja where ID_PLAN='$id'");
    $edit_agenda=mysql_fetch_array($edit_agenda_sql);
    ?>
    <form name="form" method="post" id="third" action="<?php echo $self;?>" class="niceform" style="background-color:#FFFFFF;">
    <h1>* Edit Agenda Kerja</h1>
    <label for="name"><strong><span class="blue">*</span> No Job : </strong></label>
    <input id="name" name="no_job" type="text" size="20" value="<?=$edit_agenda['no_job']?>" />
    <label for="name"><strong><span class="blue">*</span> Tgl Tugas : </strong></label>
    <input id="name" name="tgl_mulai" type="text" size="20" value="<?=$edit_agenda['tgl_tugas']?>" />
    <label for="name"><strong><span class="blue">*</span> Tgl Selesai : </strong></label>
    <input id="name" name="tgl_selesai" type="text" size="20" value="<?=$edit_agenda['tgl_selesai']?>" />
    <label for="msg"><strong><span class="blue">*</span> Uraian Job : </strong></label><br />
    <input id="name" name="tgl_selesai" type="text" size="20" value="<?=$edit_agenda['uraian_tugas']?>" />
    <label for="name"><strong><span class="blue">*</span> Catatan : </strong></label>
    <input id="name" name="note" type="text" size="20" value="<?=$edit_agenda['catatan']?>" />
    <label for="name"><strong><span class="blue">*</span> Status : </strong></label>
    <input id="name" name="note" type="text" size="20" value="<?=$edit_agenda['status']?>" />
    <br /><br />
    <input type="submit" name="login" class="buttonSubmit" value="edit" />
    <input type="button" name="close" class="buttonSubmit" value="cancel" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none';document.getElementById('edit').style.display='none'" />
    </form>
    </div>

    i want to take the attribute for editing the data in my table base on primary key..

  17. #17
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    i want to take the attribute for editing the data in my table base on primary key..
    This thread seems to have diverted quite significantly from its original purpose.

    Are you wanting to edit the data on the web page, and then to save it back in to the database?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  18. #18
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes, it does. but i have a problem when i united with the javascript code..

  19. #19
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    yes, it does. but i have a problem when i united with the javascript code..
    What is the problem that you are having?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  20. #20
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    that i've wrote before, i can't get the attribute "id=$id"..
    can you help me mr.?

  21. #21
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    that i've wrote before, i can't get the attribute "id=$id"..
    can you help me mr.?
    It must be asked then, what are you expecting to achieve with the following code?

    Code:
    <div id="edit" class="white_content">
    form edit page
    <?
    $id = $_GET['id'];
    ?>
    </div>
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  22. #22
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i want to update my table based on that primary key ($id)..

  23. #23
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    i want to update my table based on that primary key ($id)..
    The database table?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  24. #24
    SitePoint Enthusiast
    Join Date
    Sep 2009
    Posts
    45
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes database table..
    table name is "plan_kerja"..

  25. #25
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by wasis View Post
    yes database table..
    table name is "plan_kerja"..
    It's not possible to do that with JavaScript.

    What does work though is to use server-side scripting (such as PHP) to do that by submitting a form, and then only after the server-side technique is working you can use JavaScript improve the user experience side of things.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Tags for this Thread

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
  •