Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Nov 2012
    Posts
    33
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Question jsfiddle.net work code not works in wamp server..

    http://jsfiddle.net/8tAK7/
    plzz look at this script this works in perfectly in this site..I wrote this as script
    but It does not work in wampserver...

    here is my code :

    Code:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script type="text/javascript">
    $("#add_item_btn").click(function(){
        $("input[name=item_desc], input[name=item_price], input[name=item_qty]").val("");
        $("#detail").fadeIn();
    });
    
    $("#insert_item").click(function(){
        var item = $("input[name=item_desc]").val();
        var price = $("input[name=item_price]").val();
        var qty = $("input[name=item_qty]").val();
        
        if(!item){
            alert("Please fill the field.");
            return;
        }
        
        var val = item + ";" + price + ";" + qty;
        
        $("#items").append("<li>" + val + "</li>");
        $("#my_form").append('<input type="hidden" name="items[]" value="' + val + '"/>');
        $("#detail").fadeOut();
    });
    ​
    </script>
    
    </head>
    
    <body>
    <form id="my_form" method="POST">
        Here your basic form<br />
        <br/>
        Your Items: <br />
        <ul id="items">
        </ul>
        <br/>
        <input type="button" value="Add Item" id="add_item_btn" />
        <br/>
        <input type="submit" value="Create purchase request" name="submit" />
        <input type="reset" value="reset" />
    </form>
    
    <br/>
    
    <div id="detail" style="display: none">
        Item Description: <br />
        <input type="text" name="item_desc" /><br />
        Item Price: <br />
        <input type="text" name="item_price" /><br />
        Item Qty: <br />
        <input type="text" name="item_qty" /><br />
        <input type="button" value="Add" id="insert_item" />
    </div>​
    
    
    </body>
    </html>
    wht's the wrong??here,,plzz help me fix the error of this my hard code script....
    Last edited by VIPStephan; 11-25-2012 at 01:29 PM. Reason: corrected code BB tags

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,396
    Thanks
    12
    Thanked 569 Times in 562 Posts
    When you look at the left side of your jsfiddle you will see that you selected "onLoad" for the framework.

    This means that all of your javascript code will be executed only after the page finished loading. Usually you will have to use an additional piece of code in order to copy this behavior on your webspace.
    Code:
    $(document).ready(function() {
       // your code here
    });
    Alternatively you could put your script tag right before the closing </body> tag so that all the DOM elements on the page have already been loaded.

  • Users who have thanked devnull69 for this post:

    ebookz (11-25-2012)

  • #3
    New Coder
    Join Date
    Nov 2012
    Posts
    33
    Thanks
    23
    Thanked 0 Times in 0 Posts
    Code:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    
    <script type="text/javascript">
    $(document).ready(function() {
    $("#add_item_btn").click(function(){
        $("input[name=item_desc], input[name=item_price], input[name=item_qty]").val("");
        $("#detail").fadeIn();
    });
    
    $("#insert_item").click(function(){
        var item = $("input[name=item_desc]").val();
        var price = $("input[name=item_price]").val();
        var qty = $("input[name=item_qty]").val();
        
        if(!item){
            alert("Please fill the field.");
            return;
        }
        
        var val = item + ";" + price + ";" + qty;
        
        $("#items").append("<li>" + val + "</li>");
        $("#my_form").append('<input type="hidden" name="items[]" value="' + val + '"/>');
        $("#detail").fadeOut();
    });
    ​});
    </script>
    
    </head>
    
    <body>
    <form id="my_form" method="POST">
        Here your basic form<br />
        <br/>
        Your Items: <br />
        <ul id="items">
        </ul>
        <br/>
        <input type="button" value="Add Item" id="add_item_btn" />
        <br/>
        <input type="submit" value="Create purchase request" name="submit" />
        <input type="reset" value="reset" />
    </form>
    <br/>
    
    <div id="detail" style="display: none">
        Item Description: <br />
        <input type="text" name="item_desc" /><br />
        Item Price: <br />
        <input type="text" name="item_price" /><br />
        Item Qty: <br />
        <input type="text" name="item_qty" /><br />
        <input type="button" value="Add" id="insert_item" />
    </div>​
    
    
    </body>
    </html>
    I did u wht u have told me..but frnd still code does not work for me......Above the new code see it & help me recover this problem.....

  • #4
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,396
    Thanks
    12
    Thanked 569 Times in 562 Posts
    Another thing from the left side of your jsfiddle is "jQuery" which (of course) you need to include before your current script, otherwise your jQuery methods won't work
    Code:
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    Last edited by devnull69; 11-25-2012 at 12:36 PM.

  • Users who have thanked devnull69 for this post:

    ebookz (11-25-2012)

  • #5
    New Coder
    Join Date
    Nov 2012
    Posts
    33
    Thanks
    23
    Thanked 0 Times in 0 Posts
    thanksss


  •  

    Posting Permissions

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