Class: Editor

     // Create an editor instance and then setup a submit button
     var editor = new $.fn.Editor( {
       "ajaxUrl": "php/index.php",
       "domTable": "#example"
     } );
     
     editor.buttons( {
       "label": "Submit",
       "fn": function () {
         this.submit();
       }
     } );
     
 

     // Put save (submit) and cancel buttons onto a pre-existing editor instance
     editor.buttons( [
       {
         "label": "Cancel",
         "fn": function () {
           this.close();
         }
       }, {
         "label": "Save",
         "fn": function () {
           this.submit();
         }
       }
     ] );

     // Show the 'create' form with a cancel button that will call this
     // method when activated.
     editor.create( 'Add new record', [
       {
         "label": "Cancel",
         "fn": function () {
           this.close();
         }
       }, {
         "label": "Save",
         "fn": function () {
           this.submit();
         }
       }
     ] );

   // Show a 'create' record form, but with a field disabled
   editor.disable( 'account_type' );
   editor.create( 'Add new user', {
     "label": "Save",
     "fn": function () { this.submit(); }
   } );

 

   // Disable multiple fields by using an array of field names
   editor.disable( ['account_type', 'access_level'] );

   // Show a 'create' form with buttons which will enable and disable certain fields
   editor.create( 'Add new user', [
     {
       "label": "User name only",
       "fn": function () {
         this.enable('username');
         this.disable( ['first_name', 'last_name'] );
       }
     }, {
       "label": "Name based",
       "fn": function () {
         this.disable('username');
         this.enable( ['first_name', 'last_name'] );
       }
     }, {
       "label": "Submit",
       "fn": function () { this.submit(); }
     }
   );

    // Update the values available in a select list
    editor.field('island').update( [
      'Lewis and Harris',
      'South Uist',
      'North Uist',
      'Benbecula',
      'Barra'
    ] );

  

    // Equivalent calls
    editor.field('name').set('John Smith');

    // results in the same action as:
    editor.set('John Smith');

   // Client-side validation - check that a field has been given a value 
   // before submitting the form
   editor.create( 'Add new user', {
     "label": "Submit",
     "fn": function () {
       if ( this.get('username') === '' ) {
         this.error( 'username', 'A user name is required' );
         return;
       }
       this.submit();
     }
   } );

   // Show a global message for a 'create' form
   editor.message( 'Add a new user to the database by completing the fields below' );
   editor.create( 'Add new user', {
     "label": "Submit",
     "fn": function () { this.submit(); }
   } );

 

   // Show a message for an individual field when a 'help' icon is clicked on
   $('#user_help').click( function () {
     editor.message( 'user', 'The user name is what the system user will login with' );
   } );

   // Add an event to alert when the form is shown and then remove the listener
   // so it will only fire once
   editor.on( 'onOpen', function () {
     alert('Form displayed!');
     editor.off( 'onOpen' );
   } );

   // Build a 'create' form, but don't display it until some values have
   // been set. When done, then display the form.
   editor.create( 'Create user', {
     "label": "Submit",
     "fn": function () { this.submit(); }
   }, false );
   editor.set( 'name', 'Test user' );
   editor.set( 'access', 'Read only' );
   editor.open();

   // Delete a given row with a message to let the user know exactly what is
   // happening
   editor.message( "Are you sure you want to remove this row?" );
   editor.remove( row_to_delete, 'Delete row', {
     "label": "Confirm",
     "fn": function () { this.submit(); }
   } );

 

   // Delete the first row in a table without asking the user for confirmation
   editor.remove( '', $('#example tbody tr:eq(0)')[0], null, false );
   editor.submit();

 

   // Delete all rows in a table with a submit button
   editor.remove( $('#example tbody tr'), 'Delete all rows', {
     "label": "Delete all",
     "fn": function () { this.submit(); }
   } );

   // Shuffle the fields that are visible, hiding one field and making two
   // others visible before then showing the Editor#create record form.
   editor.hide( 'username' );
   editor.show( 'account_type' );
   editor.show( 'access_level' );
   editor.create( 'Add new user', {
     "label": "Save",
     "fn": function () { this.submit(); }
   } );

 

   // Show all fields
   editor.show();

   // Create an edit display used the title, buttons and edit methods (note that
   // this is just an example, typically you would use the parameters of the edit
   // method to achieve this.
   editor.title( 'Edit record' );
   editor.buttons( {
     "label": "Update",
     "fn": function () { this.submit(); }
   } );
   editor.edit( TR_to_edit );

 

   // Show a create form, with a timer for the duration that the form is open
   editor.create( 'Add new record - time on form: 0s', {
     "label": "Save",
     "fn": function () { this.submit(); }
   } );
   
   // Add an event to the editor to stop the timer when the display is removed
   var runTimer = true;
   var timer = 0;
   editor.on( 'onClose', function () {
     runTimer = false;
     editor.off( 'onClose' );
   } );
   // Start the timer running
   updateTitle();

   // Local function to update the title once per second
   function updateTitle() {
     editor.title( 'Add new record - time on form: '+timer+'s' );
     timer++;
     if ( runTimer ) {
       setTimeout( function() {
         updateTitle();
       }, 1000 );
     }
   }