Question

I’m having an issue with a form.

I have a button that when I click it it runs this script:

function new() {

    $('#new').load("Insert.jsp");
};

The insert page is a dialog box. It has 4 tabs and each tab has its own form.

Lets say I wanna insert the number “10” in my database. So I write 10 and click the button Register. The register button will run this script:

function insert() {
$('#insert').load("ServletInsert",
                $('#form').serialize());
    };

Then my Servlet receives the form and insert it in my Database. So far no problem.

When I close the dialog box and re-open it, I can’t insert anything else. If I try to insert the number “20” my database throws a SQLException because I can’t use the number “10” again since it’s column is a Primary Key.

The problem is, even when I write something new, it still keeps the old value in my form (after I close and re-open it).

Please, can anyone help me with this?

Answer 1

It looks like you could possibly using non-unique Id’s. Try changing your form id to a class, then selecting it by class.

<form class="form">

and

$(".form").serialize();

But even that won’t work properly, you need to select the form based on the element that the event originated from.

UPDATE
Add a handler to the close event of the dialog that removes the dialog to prevent duplicate dialogs existing in the DOM. By default closing the dialog simply hides it, it does not get removed.

$("#dialog").dialog({
    close: function(){
        $(this).remove();
    }
});