Set ajax value to the textbox[in modal box jquery]

Question

Hi,
In my page i have one interactive report with 2 button add and edit, i have used modal box j-query for the button add and edit. Adding the data through modal box working fine.
when tried to edit the existing data i am not able set the data to the corresponding textbox in apex.
please find my modal box script:
<link rel="stylesheet" href="#APP_IMAGES#modal-jquery-ui.css" type="text/css">
<script src=#APP_IMAGES#modal-jquery.js type="text/javascript"></script>
<script src=#APP_IMAGES#modal-jquery-ui.js type="text/javascript"></script>
<script type="text/javascript">
$( function() {  
     $('#ModalForm').dialog({       
          modal : true ,
width: 550,
height: 300,
          autoOpen : false,
resizable: false,
          buttons : {           
               Cancel : function() {               
                    closeForm();
               Add : function() {                    
                    addPerson();
$('#ModalForm1').dialog({       
          modal : true ,
width: 550,
height: 300,
          autoOpen : false,
resizable: false,
          buttons : {           
               Cancel : function() {               
                    closeForm1();
               Update : function() {                    
                    updateperson();
function openForm(){   
     $('#ModalForm').dialog('open');
function openFormclose(){   
     $('#ModalForm1').dialog('open');
alert('opened');
var updateval = document.getElementById('P37_UPDATEID').value;
var get = new htmldb_Get(null,html_GetElement('pFlowId').value, 'APPLICATION_PROCESS=updateperson',0);
get.add('P37_UPDATEID',updateval);
var gReturn = get.get();
alert(gReturn);
document.getElementById('P37_UPADATEPRONAME').value = gReturn;
function closeForm1(){   
     $('#ModalForm1 input[type="text"]').val('');
     $('#ModalForm1').dialog('close');
function closeForm(){   
     $('#ModalForm input[type="text"]').val('');
     $('#ModalForm').dialog('close');
function addPerson(){
     if (document.getElementById('P37_ADDSOFTDETAILS').value == ""){
          alert('Please Enter Software Details.');
          return false;
     if (document.getElementById('P37_ADDSOFTVERSION').value == ""){
          alert('Please Enter Software Version.');
          return false;
     if (document.getElementById('P37_STANDARD').value == ""){
          alert('Please Enter Software Standard.');
          return false;
          var ajaxRequest = new htmldb_Get( null , &APP_ID. , 'APPLICATION_PROCESS=addPerson', 0);
          ajaxRequest.add( 'P37_ADDSOFTDETAILS', $v('P37_ADDSOFTDETAILS'));
     ajaxRequest.add( 'P37_ADDSOFTVERSION', $v('P37_ADDSOFTVERSION'));
          ajaxRequest.add( 'P37_STANDARD', $v('P37_STANDARD'));
          ajaxRequest.get();
          ajaxRequest = null;
          closeForm();
          gReport.search('SEARCH');
</script>
and find the corresponding on demand process below:
addPerson:
DECLARE
BEGIN
INSERT INTO xxxxxx.yyyyyyyyyy (
INT_PRODUCT_SEQ,
INT_PRODUCT_NAME,
INT_PRODUCT_VERSION,
INT_PRODUCT_VERSION_DEFINE,
CREATED_BY,
CREATED_DATE
VALUES (xxxxxx.INT_ADD_SOFTDETAILS_SEQ.NEXTVAL,
:P37_ADDSOFTDETAILS,
:P37_ADDSOFTVERSION,
:P37_STANDARD,
V ('APP_USER'),
SYSDATE);
COMMIT;
apex_application.g_print_success_message := 'Record Inserted Successfully.';
EXCEPTION
WHEN OTHERS
THEN
apex_application.g_print_success_message := 'Falied to Inserted Data.';
END;
and updateperson: is
DECLARE
v_product_name varchar2 (240);
v_product_version varchar2 (240);
v_product_version_standard varchar2 (240);
v_update varchar2 (240);
BEGIN
BEGIN
SELECT INT_PRODUCT_NAME,
INT_PRODUCT_VERSION,
INT_PRODUCT_VERSION_DEFINE
INTO v_product_name, v_product_version, v_product_version_standard
FROM xxxxxxx.yyyyyyyyy
WHERE INT_PRODUCT_SEQ = :P37_UPDATEID;
HTP.prn (v_product_name);
EXCEPTION
WHEN OTHERS
THEN
HTP.prn( 'An error was encountered - '
|| SQLCODE
|| ' -ERROR- '
|| SQLERRM);
END;
END;

Answer 1

Hi,
First of all:
I can't find any definition of the function updateperson(); called in $('#ModalForm1').dialog - button Update.
There is alert('opened'); only. There should be declaration of the updateperson() function.
There isn't setting of the corresponding items when the update modal form opened.
I use it this way.
function openForm(v_add_details, v_add_softv, v_stand)
    $('#ModalForm').dialog('open');
    $s('P37_ADDSOFTDETAILS', v_add_details);
    $s('P37_ADDSOFTVERSION',  v_add_softv);
    $s('P37_STANDAR', v_stand));
}where the P12_X ... items are the modal form items. and the v_ ... parameters are the parameters of corresponding columns from report. (you have there something like: redirect to URL: javascript: openFormclose();
It should be changed to something like openFormclose('#P37_ADDSOFTDETAILS#', '#P37_ADDSOFTVERSION#', '#P37_STANDARD#');
Maybe this example will guide to you a little :D
otherwise try to reproduce your solution on apex.oracle.com. there i can modify your code to make it work.
EDIT: I use the PLUGIN posted by Denes. It works well too. I used above solution before the plugin was released.
regards
J :D
Edited by: jozef_SVK on 10.5.2013 4:07