frappe/docs/old/_sources/client_side_script.txt

Client Side Scripts
===================

Introduction
------------

Client side scripts are written in javascript and they are used to execute function on event triggers.
These scripts can be used to:

* Manipulate views
* Do server calls (AJAX)
* Validate entries
* Do calculations

Client scripts can be written inside of DocType in the "Client Script" tab

cur_frm Object
--------------

All client script functions are attached to the cur_frm.cscript object. This object holds the functions
relating to a DocType (form)

onload event
------------

onload is called when the a record is loaded for the first time. Example::

  cur_frm.cscript.onload = function(doc, doctype, docname) {
    if(!doc.from) {
      doc.from_user = user;
      refresh_field('user')
    }
  }

refersh event
-------------

refresh event is similar to the onload event. Except that it is also called each time the page is refreshed
either via a user refresh, save or otherwise.

Server Calls
------------

A typical use is to get/set data at server side. To do this, the framework has built-in AJAX interface using
the $c_obj (call server object) function. The typical pattern is as follows::

  // function will be called when the server responds
  var callback = function(response, responseInText) {	
  	// set the new value
  	
  	// re-assign the doc record because you are inside the callback
  	var doc = locals[doc.doctype][doc.docname]
  	
  	doc.new_value = response.message
  	refresh_field('new_value');
  }

  // call this object on the server
  $c_obj([doc], 'get_my_value', doc.based_on, callback);

Field Level Triggers
--------------------

You can set functions to be called when values are changed in the form, at the "onchange" event.

To set a trigger, in the Field table, set the value of the Trigger column to "Client".

Declare a function to be called by its fieldname::

  // attach a trigger on the "my_value" field
  cur_frm.cscript.my_value = function(doc, doctype, docname) {
  	msgrint("My value has been changed")
  	// do something
  }

Fetch Pattern
-------------

Another typical pattern is to get values based on other values, like when you select a Customer, its type and
contact info should come automatically, to do this, you can use the standard fetch pattern on link fields::

// add_fetch(link, source_field_name, target_field_name)

add_fetch('customer', 'contact_details', 'contact_details')