Hi Irwan,
Thanks for your reply.
I am using a class to trigger the function $(".delete_icon").click
(function() {
the id on each element is unique anyway as the table is dynamically
generated on the server before its sent to the browser. The value if
the id attribute is the user id pulled from the database and this is
only used to identify which user is to be deleted during the ajax call
to my delete script.
However not to dismiss the fact that it might be a problem with
sending this value through the id attribute I switched it to use the
title attribute to see if that solved it, but no luck still the same
behaviour.
Any other ideas would be greatly appreciated.
Kind regards, Richard
On 28 Aug, 03:53, "Meroe" <whme...@gmail.com> wrote:
> Richard,
>
> A similar question was asked not to long ago. Here is the reply (not from
> me). If I recall correctly this resolved the issue.
>
> Hi,
>
> "id" is designed to work with only 1 instance in a web page.
> If you need multiple instances of an element, use class="newsTrigger"
> instead of id="newsTrigger".
> And change $('#newsTrigger') into $('.newsTrigger').
>
> Regards,
> Irwan Setiawan
>
>
>
> -----Original Message-----
> From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
>
> Behalf Of Richard
> Sent: Thursday, August 27, 2009 2:18 PM
> To: jQuery (English)
> Subject: [jQuery] inline delete ajax function/confirm dialog
>
> Hi all,
>
> I have an inline delete icon on a table of a query, when the delete
> button is clicked, i have a dialog popup to confirm the action i then
> issue an ajax call to delete the user from the database and then
> remove the tr from the table. it all works fine until the dialog is
> closed. either through the delete ajax function or the cancel function
> of the dialog. The dialog will then not open if any of the delete
> icons are clicked in the table until a page refresh.
>
> I hope someone can help as this is driving me crazy.
>
> Here's my code
>
> $(".delete_icon").click(function() {
>
> var thisRow = $(this).parents("tr");
> var userID = $(this).attr("id");
>
> $(thisRow).css({ "background-color" : "#fbcdcd" },
> 'fast');
>
> $("#confirmDeleteStaff").dialog({
> bgiframe: true,
> resizable: false,
> height:160,
> width:300,
> modal: true,
> overlay: {
> backgroundColor: '#000',
> opacity: 0.5
> },
> buttons: {
> 'Delete Staff Member': function() {
> $(this).dialog('close');
>
> $.get("/admin/delete_staff.cfm", { id: userID } );
> // And we make the deleted
> row to dissapear! //
> $(thisRow).fadeOut("fast");
> },
> Cancel: function() {
> $(thisRow).css({
> "background-color" : "#fff" }, 'fast');
> $(this).dialog('close');
>
> }
> }
> });
>
> });
>
> and the div for the dialog
>
> <div class='hidden'>
> <div id="confirmDeleteStaff" title="Delete Staff Member?">
> <p><span class="ui-icon ui-icon-alert" style="float:left;
> margin:0 7px 20px 0;"></span>This Staff Member will be permanently
> deleted. Are you sure?</p>
> </div>
> </div>
