Question

i have this code

<input type='submit' name='sub_form' value='Save'> and <a href="#" class="close">Cancel</a>

and the jQuery is

$('td.add_text').click(function(e) {
    $('<img src="images/ajaxLoader.gif" id="loading" style="width:auto;" />').appendTo(".quotation_computation");
    //Cancel the link behavior
    e.preventDefault();
    //Get the A tag
    var ccom = $( 'input[name=com_code]' ).val();
    var ucom = $( 'input[name=user_code]' ).val();
    var in_form = $( 'input[name=in_form]' ).val();
    var ctrack = $( 'input[name=com_for_track]' ).val();

    $.ajax({
        type:"GET",
        url:"forms/tem.php",
        data: {uc: ucom, cc: ccom, ct: ctrack, in_f: in_form },
        dataType: 'html',
        target: '.quotation_computation',
        success: function(data){
            $(".quotation_computation").find('img#loading').remove();
            $(".quotation_computation").html(data);
        }
    })
});

and the close button jquery

$(".close").click(function () {
      $(".quotation_computation").hide();
});

and the html

<div class="quotation_computation">
ANOTHER JQUERY PROBLEM
</div>

when i click the close button it does not working.

is my close button wrong?
okie when i click the div class="quotation_computation"> the jquery ajax was working fine and it save to my database. but when i click the Cancel button the jquery ajax or the form is still there.

is there something that i need to change?

Answer 1

Clicking the <a href="#"> anchor tag will have a default action, i.e. it will force a page refresh. You will have to prevent this default action, otherwise it will refresh the page and reopen the element you just hid.

$('.close').click(function(e) {
   $('.quotation_computation').hide();
   e.preventDefault();
});