CODEWITHSUNDEEP
ajaxjquery-uijquery
Matthew
Matthew

Reputation: 195

jquery dialog box issue

At this moment i am using the code bellow to bring up a dialog box to edit mysql records but my issue is the button im using to bring up the dialog box is going thru a while loop to allow me to edit any record but whats happening is that the top button will bring up the dialog box but the 2nd 3rd and so on i have worked out why this is happening, it is because they all have the same "id" but my question is that is there any way to bring up the dialog box when ever i click on any of the buttons without writing 100's of dialog boxs in..

    $( "#edit" ).dialog({
                autoOpen: false,
                draggable: false,
                modal: true,
                width: "322",
                buttons: {
                    "Add to Log": function() {
                      $( this ).dialog( "close" );  
                    },
                    Exit: function() {
                        $( this ).dialog( "close" );
                    }
                }

            });

            $( "#editi" ).click(function() {
                $( "#edit" ).dialog( "open" );
                return false;
            });
</script>


 <button id="editi">Edit</button> // normally goes thru a while loop and is reapeted 5 or 6 times but only the frist one genrated works

    <div class="edit" id="edit" title="Edit Entry" style="font-size:15px">
    <p>hello</p>

Upvotes: 1

Views: 381

Answers (3)

Netorica
Netorica

Reputation: 19327

$("#edit").dialog({
                autoOpen: false,
                draggable: false,
                modal: true,
                width: "322",
                buttons: {
                    "Add to Log": function() {
                      $( this ).dialog( "close" );  
                    },
                    Exit: function() {
                        $( this ).dialog( "close" );
                    }
                }

            });

/*this is the area that is looped*/
            $(".editi").click(function() {
                $( "#edit" ).dialog( "open" );
                return false;
            });
</script>


 <button class="editi">Edit</button>

    <div class="edit" id="edit" title="Edit Entry" style="font-size:15px">
    <p>hello</p>

Upvotes: 2

Ankur Verma
Ankur Verma

Reputation: 5933

keep the class as editi rather keeping it as a id and for that do:

$('.editi').click(function(){
   //do what you want to do
})

Upvotes: 0

tzerb
tzerb

Reputation: 1433

Are you repeating the same id (editi) several times? You may want to create a class like buttonClass and hook up the button this way:

        $( ".buttonClass" ).click(function() { 
            $( "#edit" ).dialog( "open" ); 
            return false; 
        });

Upvotes: 1

Related Questions