Open In App

script.aculo.us InPlaceEditor okButton Option

Improve
Improve
Like Article
Like
Save
Share
Report

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 okButton option is used to specify whether the button used to save the changes and submit changes to the server will be displayed or not. The default value is set to true.

Syntax:

{ okButton : boolean }

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

boolean: This is a boolean value that specifies that the button used to submit the changes to the server will be displayed or not. The default value is set to true.

The below example illustrates the use of this option.

Example: The below HTML file demonstrates this example:

HTML




<html>
   
<head>
    <script type="text/javascript"
        src="javascript/prototype.js">
    </script>
   
    <script type="text/javascript"
        src="javascript/scriptaculous.js?load = controls">
    </script>
   
    <script type="text/javascript">
        window.onload = function () {
   
            // InplaceEditor with okButton
            // option set to true
            new Ajax.InPlaceEditor(
                'editableElement',
                'inplace.php',
                {
                    okButton: true
                }
            );
   
            // InplaceEditor with okButton
            // option set to false
            new Ajax.InPlaceEditor(
                'editableElement2',
                'inplace.php',
                {
   
                    // Specify the boolean value
                    // whether the button will be shown or not
                    okButton: false
                }
            );
        }
    </script>
</head>
   
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
   
    <h2>InPlaceEditor okButton Option</h2>
   
   
     
 
<p>
        The "okButton" option is used to specify
        whether the ok button will be shown or not
    </p>
 
  
   
   
    <b>
        This element has the okButton set to true
    </b>
   
    <div id="editableElement">
        Click this element to edit
    </div>
    <br>
   
    <b>
        This element has the okButton set to false
    </b>
       
    <div id="editableElement2">
        Click this element to edit
    </div>
</body>
   
</html>


PHP




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


Output:



Last Updated : 25 Jan, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads