jqery in chunk

1 Posts

niko1312 Reply #1, 15 years, 2 months ago

Hello,

I am stuck with the following issue: i have an input on a form. The value from that field is a random value. I try to pass this value to the server by button click. But i am not able sad

Here is the chunk code:

<input type="button" style="boder:0; color:#f6931f; font-weight:bold;" value="Salveza cheltuieli" onclick="javascript:insertName()">

<script type="text/javascript">
function insertName(){
  var value = $('#amount').val();
  
  $.ajax({
   url: '[[!settotal]]',
   type: 'POST',
   success: function(){
     $('#totalvalue').text(value);
   }
  });
}
</script>

In ajax I call the settotal snippet which looks like:

$sql = 'UPDATE `modx_users_total` SET `total` =57
WHERE CONVERT(`id` USING utf8) = \'1\' LIMIT 1';
$modx->exec($sql);

Nothing complicated i think.
But i can not send a value to the snippet.
Seems like a different behavior of $.ajax() in MODX than in simple PHP/html

DId anyone encounter such a problem, or if anyone could suggest the way to dig - i would appreciate that.

Regards,

Nicolae

☆ A M B ☆
24,524 Posts

sottwell Reply #2, 15 years, 2 months ago

The ajax requires a URL, not PHP code. Put your snippet in a resource with a "blank" template, and use the URL to that resource for the ajax.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

1 Posts

niko1312 Reply #3, 15 years, 2 months ago

Thanks will use this approach.

Another question: how to pass a JS variable as a parameter into a snippet in such a code:

var test = $('#amount').val();

'[[!settotal?save='+test+']]'

Note that the ’test’ variable is assigned correctly (alert(test);) is displaying the correct value.

Nicolae

863 Posts

Lucas Reply #4, 15 years, 2 months ago

Hi Nicolae, it’s not possible to pass a js variable to a snippet on the same page, as the snippet is parsed by MODx before your page loads.

As sottwell suggested, you need to include your ’settotal’ snippet on a separate blank page, and pass it like this:

<script type="text/javascript">
function insertName(){
  var value = $('#amount').val();
  
  $.ajax({
   url: '[[~5]]',       // where '5' is the id of the blank page containing [[!settotal]] snippet
   type: 'POST',
   data: { save: 'test' }      // comma separated parameters here
   success: function(){
     $('#totalvalue').text(value);
   }
  });
}
</script>

Then in your ’settotal’ snippet use $_REQUEST[’save’] to get the value of test.

1 Posts

niko1312 Reply #5, 15 years, 2 months ago

Thanks guys! grin

☆ A M B ☆
24,524 Posts

sottwell Reply #6, 15 years, 2 months ago

The trick is to keep the javascript separate from the PHP in your head. The PHP is processed on the server before the page is ever sent to the user. The javascript is processed in the user’s browser, after the page has been processed and sent.

AJAX sends a request to the server, the server processes it like any other HTTP request, and the information is returned; the server (and MODx) doesn’t even know that this isn’t a normal page request. Now the javascript can modify the page in the browser to incorporate the new material without requiring a reload of the whole page.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org