script.aculo.us InPlaceEditor savingText Option

Last Updated : 26 Nov, 2020

The script.aculo.us library is a cross-browser library that aims at improving the user interface of a website. The Ajax.InPlaceEditor is used to make elements editable thereby allowing the user to edit the content on the page and submit the changes to the server.

The InPlaceEditor savingText option is used to specify the text to be shown while the text is being sent to the server to be saved. The default string of the option is "Saving…".

Syntax:

{ savingText : value }

Parameters: This option has a single value as mentioned above and described below:

value: This is a string that specifies the text to be shown while the text is being sent to the server. The default string is "Saving…".

The below example illustrates the use of this option.

Example: The below script is required to simulate the saving of data to the server.

PHP

<?php
  
  // Simulate the time taken by
  // the server
  sleep(1);

  if( isset($_REQUEST["value"]) ) {
    $str = $_REQUEST["value"];
    echo $str;
  }
?>

The below script demonstrates this with the example:

HTML

<!DOCTYPE html>
<html>

<head>
    <script type="text/javascript" 
        src="prototype.js">
    </script>

    <script type="text/javascript" 
        src="scriptaculous.js?load = controls">
    </script>

    <script type="text/javascript">
        window.onload = function () {

            // Default InplaceEditor with no
            // options
            new Ajax.InPlaceEditor(
                'editableElement',
                'http://localhost/tmpscripts/inplace.php',
            );

            // InplaceEditor with the savingText
            // option changed to a custom value
            new Ajax.InPlaceEditor(
                'editableElement2',
                'http://localhost/tmpscripts/inplace.php',
                {

                    // Specify the text to be used
                    // while sending to server
                    savingText: "Saving the contents..."
                }
            );
        }
    </script>
</head>

<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>

    <h2>InPlaceEditor savingText Option</h2>
    
    
    <p>
        The "savingText" option is used to
        specify the text to be shown when the
        text is being saved.
    </p>

    <b>
        This element has the savingText as
        the default one.
    </b>
    
    <div id="editableElement">Click to edit</div>
    <br>

    <b>
        This element has the savingText
        set to a custom value.
    </b>
    
    <div id="editableElement2">Click to edit</div>
</body>

</html>

Output:

script.aculo.us InPlaceEditor size Option

sayantanm19

Improve

Article Tags :

script.aculo.us InPlaceEditor savingText Option

Similar Reads

Thank You!

What kind of Experience do you want to share?