Dear everyone,

I am building a form module which I then built a jQuery UI confirmation Dialog. Basically, the site visitor clicks on "Buy" on the form and a jQuery UI dialog with a "Confirm" and "Cancel" buttons pops up to confirm the action. Until now everything is great but the only problem I have is I don't know how to assign action for the "Confirm" button once the client clicks it. I would like to set a variable in the jQuery script (e.g. $confirm_action = 1) and then build a function in the module that will do something if the variable is == 1. I don't know if the Drupal module will identify the variable defined by the jQuery. Can anyone direct me to the correct direction. Thank you all very much in advance.

Comments

Jaypan’s picture

See the top answer here: http://stackoverflow.com/questions/887029/how-to-implement-confirmation-...

You can add whatever functionality you want to happen when the user confirms the dialog here:

$("#dialog").dialog({
  buttons : {
    "Confirm" : function() {
     // Do what you want to do when the user confirms the dialog
    },
    "Cancel" : function() {
      $(this).dialog("close");
    }
  }
});
Amjad_dokhan’s picture

Dear Jaypan,

This is exactly what I'm asking about. If I put the following code:

"Confirm" : function() {
   
   $confirm_purchase = 1;

    },

Will my Drupal module identify this $confirm_purchase variable ? I've tried but it seems as if it doesn't.

Jaypan’s picture

Well, I'm not clear on what you mean by your Drupal module identifying it - if you have JavaScript in your module, then it can be set up to use that variable. But if you are talking about a PHP variable, then no. PHP and JavaScript are entirely separate - PHP is on the server, and JavaScript is in the user's browser. If you want to change PHP values from JS, you'll need to make an AJAX call to the server and make whatever changes you want on the server.

Amjad_dokhan’s picture

Dear Jaypan,

Thank you for your great fast insight as always. I will be looking into how to make an AJAX call to perform the action I need. Thanks alo again ! Have a nice day :)

Amjad_dokhan’s picture

So Japan, I've done some homework, and this is as far as I got:

This is the module I have (named: user_upgrades.module):


function user_upgrades_form_table_form($form = array(), &$form_state) {
.
.
 'c5' => array(
          '#type' => 'submit',
          '#value' => t('Buy'),
          '#attributes' => array('onclick' => 'myFunction()'),
.
.
return $form;
}

and the script named script.js

function myFunction() {
(

function ($) {
  
$(document).ready(function(){
.
.
$("#demo").text('Are you sure ?').dialog({width: 250});                      

buttons: {
 'Ok': function() {
           $.ajax({
       url:"/sites/all/modules/user_upgrades/user_upgrades.module",
       data: {name: 'Wayne'},
       type: "GET",
       dataType : "text",
           })
.
.

Then I go back to the module and code this:

if ($_GET['name'] == 'Wayne') { 

// Do something, like update an mysql entry

}

But Drupal is unable to identify the variable 'name'. Do you know of a guide or a tutorial that I can read ? Many thanks again .

Jaypan’s picture

Well, the main problem I see with your AJAX is that you have given it a callback path that is a module file - that won't work! (As you have figured out).

You need to create a path with hook_menu(), and use that for your ajax callback path. Inside that you will define a page callback function, and that is where you'll use $_GET['name'].

This tutorial isn't exactly what you want, but it looks to have the parts about defining a menu path and a page callback: https://www.drupal.org/node/2046693

Amjad_dokhan’s picture

Dear Jaypan,

Thanks. I'll check the tutorial out and try to do as you so. Many thanks again.

Jaypan’s picture

No problem. I'm sure you'll have more questions, feel free to keep asking! I'm always happy to help someone who is trying to do it themselves first, based on the info I've given.

Amjad_dokhan’s picture

I cannot believe it ! I've been after this for a week now. I did exactly as you said and it worked. I coded this into the module:

$items['user_upgrades_ajax_callback'] = array(
    'title' => 'xxx',
    'page callback' => 'buy_lsu',
    'access callback' => TRUE,
    );

then this in the jquery script:

buttons: {
 'Ok': function() {
       
    $.ajax({
       url:"http://localhost/drupal/user_upgrades_ajax_callback",
       data: {name: 'wayne'},
       type: "GET",
       dataType : "text",
           })

then this at the bottom of the module:

function buy_lsu() {

if ($_GET['name'] == "wayne") {

$buy_lsu= db_query("UPDATE <em>table </em>SET <em>column </em>= '15000' WHERE fid = 2");

}
}

It worked like a charm. All the respect to you Jaypan! you've been very helpful as always. I really appreciate the help. Many thanks again.

Jaypan’s picture

No problem. I'm glad you've got it working.

Now that you've got it working, here are a few things you should clean up:

1) You are using $(document).ready(), which is fine outside Drupal, but you should use Drupal.behaviors instead in Drupal.

2) Instead of setting your AJAX callback URL as http://localhost/drupal/user_upgrades_ajax_callback, you should set it as /user_upgrades_ajax_callback so that it works when you move it remotely.

I actually usually build callback paths in the page callback where the JS is added, using the url() function, then pass it to my script using Drupal.settings.

3) I'd change this:

if ($_GET['name'] == "wayne") {

To this:

$params = drupal_get_query_parameters();
if(isset($params['name']) && $params['name'] == 'wayne') {
Amjad_dokhan’s picture

Thanks for the tips Jaypan. I always try to improve my codes better and better. I'm now reading all the tips one by one and experimenting to make the code cleaner as you advised. It's a long journey but its worth it ! Thank you very much :)