jQuery вызвать один dialog с разными параметрами

[p486]

доброго времени суток!
пишу админку для работы с таблицей. при удалении записи должен выскакивать dialog jQuery с запросом. но такой диалог выскакивает только при нажатии на первую ссылку. как при нажатии на ссылку еще и передать id записи строки из БД? в php скрипте я могу выводить все id строк.
в интернете внятного ответа не нашел

 

[Aserus]

Если нужно менять значения input то воспользуйся Для просмотра ссылки Войди или Зарегистрируйся

 

[cooli0]

Вопрос не полный. Нет никаких примеров.
Если вы передаете данные на сервер через аякс, то можно использовать поле data, в которое передавать id записи.

jQuery.ajax({
    url: '/some.url',
    data: { id: row_id }
});

 

[p486]

есть такая табличка при нажатии на кнопку "удалить" должен выскакивать диалог с кнопками да/нет. обработчик диалога должен быть один а кнопок которые его вызывают N-ное количество. тоесть кнопка должна передавать свой id в процедуру обработки диалога.

код из примера jQuery

<script>
    $(function() {  
        $( "#accordion" ).accordion();
      
        var availableTags = ["ActionScript","AppleScript","Asp","BASIC","C","C++","Clojure","COBOL","ColdFusion","Erlang","Fortran",
            "Groovy","Haskell",    "Java",    "JavaScript","Lisp","Perl",    "PHP","Python",    "Ruby",    "Scala","Scheme"];
        $( "#autocomplete" ).autocomplete({
            source: availableTags
        });
      
        $( "#dialog" ).dialog({
            modal: true,
            title: "fkjdkfdjsfk",
            caption: "Delete selected record(s)?",
            autoOpen: false,
            width: 400,
            buttons: [
                {
                    text: "Ok",
                    click: function() {
                        $( this ).dialog( "close" );
                    }
                },
                {
                    text: "Cancel",
                    click: function() {
                        $( this ).dialog( "close" );
                    }
                }
            ]
        });

        // Link to open the dialog
        $( "#dialog-link" ).click(function( event ) {
            $( "#dialog" ).dialog( "open" );
            event.preventDefault();
        });
    });
    </script>

<!-- Dialog NOTE: Dialog is not generated by UI in this demo so it can be visually styled in themeroller-->
<div id="dialog-link" class="ui-state-default ui-corner-all">
<a href="#?t1" class="ui-icon ui-icon-newwin">
</a>
</div>

<div id="dialog-link" class="ui-state-default ui-corner-all">
<a href="#?t2" class="ui-icon ui-icon-newwin">
</a>
</div>
   
<!-- ui-dialog-->
<div id="dialog" title="Dialog Title">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>

 

[p486]

в последнем куске кода описано две кнопки. при нажатии на первую окно выскакивает, при нажатии на вторую НЕТ

 

[Prostobv]

у вас у div'ов айдишники одинаковые из-за них конфликт скорее всего происходит..

 

[jDony]

1) ID параметры у тегов должны быть УНИКАЛЬНЫ на всей странице, у вас они дублируются.
2) Для подтверждения какого-либо действия я обычно использую данный подход:

// Jquery function which listens for click events on elements which have a data-delete attribute
$('[data-delete]').click(function(e){
    e.preventDefault();
    // If the user confirm the delete
    if (confirm('Do you really want to delete the element ?')) {
        // Get the route URL
        var url = $(this).prop('href');
        // Get the token
        var token = $(this).data('delete');
        // Create a form element
        var $form = $('<form/>', {action: url, method: 'post'});
        // Add the DELETE hidden input method
        var $inputMethod = $('<input/>', {type: 'hidden', name: '_method', value: 'delete'});
        // Add the token hidden input
        var $inputToken = $('<input/>', {type: 'hidden', name: '_token', value: token});
        // Append the inputs to the form, hide the form, append the form to the <body>, SUBMIT !
        $form.append($inputMethod, $inputToken).hide().appendTo('body').submit();
    }
});

В html создаете ссылку:

<a href="/script.php?act=delete&id=1" data-delete>Удалить</a>
<a href="/script.php?act=delete&id=2" data-delete>Удалить</a>
<a href="/script.php?act=delete&id=3" data-delete>Удалить</a>
<a href="/script.php?act=delete&id=4" data-delete>Удалить</a>

И теперь при нажатии на ссылку 'Удалить' у вас будет выскакивать подтверждение, и при ответе Yes, будет динамечески создаваться форма с методом POST и отправлять на сервер по адресу из href

Причем не обязательно чтоб это был тег <a>, это может быть любой элемент с параметром data-delete.

Если есть какие-либо вопросы, обращайся в ЛС, или пишу тут - помогу.

 

[p486]

Если есть какие-либо вопросы, обращайся в ЛС, или пишу тут - помогу.

спасибо это то, что нужно. а как теперь оформить этот диалог темой из jQuery?

 

[jDony]

спасибо это то, что нужно. а как теперь оформить этот диалог темой из jQuery?

Заместо:

// Link to open the dialog
$( "#dialog-link" ).click(function( event ) {
    $( "#dialog" ).dialog( "open" );
        event.preventDefault();
});

Пишете:

// Link to open the dialog
$('[data-delete]').click(function(e){
    e.preventDefault();
        $( "#dialog" ).data('href', $(this).prop('href')).dialog( "open" );
});

И вместо:

text: "Ok",
click: function() {
    $( this ).dialog( "close" );
}

Вставляем:

text: "Ok",
click: function() {
    // Get the route URL
    var url = $("#dialog").data('href');
    // Create a form element
    var $form = $('<form/>', {action: url, method: 'post'});
    // Add the DELETE hidden input method
    var $inputMethod = $('<input/>', {type: 'hidden', name: '_method', value: 'delete'});
    // Add the token hidden input
    var $inputToken = $('<input/>', {type: 'hidden', name: '_token', value: token});
    // Append the inputs to the form, hide the form, append the form to the <body>, SUBMIT !
    $form.append($inputMethod, $inputToken).hide().appendTo('body').submit();
    $( this ).dialog( "close" );
}

 

[p486]

Заместо...

спасибо все получилось. теперь у меня другая задача. нужно реализовать процедуру редактирования записи. диалог я уже сделал и выскакивает он по нажатию на любую ссылку. осталось только перед показом диалога заполнять его поля значениями из конкретных ячеек таблицы. на сколько я понял нужно вставить кусок кода в это место

        $('[data-edit]').click(
            function(e)
            {
                e.preventDefault();
                // место для кода
                $( "#editDialog" ).data('href', $(this).prop('href')).dialog( "open" );
            }
        );

только вот, что туда вставлять я не знаю. дайте хотябы направление