php/javascript промяна на вграден етикет след актуализация на DB

това е първият ми пост.. въпросът ми вероятно е много прост, но не мога да намеря правилния начин..!

Имам php страница с избор на заявка от база данни за показване на много записи, за всеки запис съм поставил формуляр с някои полета, които трябва да бъдат актуализирани и бутон „запазване“

така че за всеки запис имам колона в таблицата с резултати, съдържаща формуляр като:

$code = "<td><form method='POST' action='mypage.php' target='_blank' />";

$code .= " <input type='hidden' name='function' value='formtaglieok' />";
$code .= " <input type='hidden' name='email' value='".$email."' />";
$code .= " <input type='hidden' name='main' value='".$main."' />";
..... some other editing fields
$code .= "<input type='text' name='field1' value='' size='2' />"
..... some other editing fields
$code .= "<td><input type='submit' value='Save' /></td>"

след тази колона съм поставил етикет, който искам да променя след натискане на бутона и актуализиране на записа, като:

$code .= "<td><div id='<this_record_id>' ></div></td>";

в mypage.php имам php кода за актуализиране на записа:

function updaterecord($_POST){
  ...connection to db, prepare the query etc..
  $stid = OCIParse($conn, $query);        

  if (OCIExecute($stid)) {
      $res .= "Saved ";
  } else {
      $res .= "Error";      
  } 

  echo $res;     
}

очевидно, с този вид действие на формуляра и целта "_blank", виждам в нова страница резултата "Saved" или "Error" и актуализирането на записа в DB е добре

Това, което бих искал, е да не поставям „Запазено“ в нова страница, а да актуализирам div this_record_id до бутона „запазване“

така че ще се опитам да добавя събитието onClick към бутона за изпращане

<input type='submit' value='Save' onclick='jSaved(<this_record_id>)' />

и поставете този код в главата на страницата

<script type='text/javascript'>
function jSaved(bcode){

    document.getElementById(bcode).innerHTML = 'Saved';
}
</script>

и актуализира етикета правилно, но отваря и друга страница.

това, което бих направил, е да изпълня функцията си за актуализиране в JS кода, използвайки масива $_POST, така че не получавайте нова страница, а само резултата от функцията в етикета.

някой може ли да ми помогне?

редактиране: РЕШЕНО

1) моята php главна страница с формуляр като (ВАЖНО задайте form_id):

$code = "<form name='frm_".$record['TD001_SEQ']."' id='frm_".$record['TD001_SEQ']."' action='' />";

$code .= " <input type='hidden' name='function'  id='function' value='formtaglieok' />";


$code .= " <input type='hidden' name='email'     id='email' value='".$email."' />";
$code .= " <input type='hidden' name='main'      id='main' value='".$main."' />";
$code .= " <input type='hidden' name='store'     id='store' value='".$store."' />";
$code .= " <input type='hidden' name='valuta'    id='valuta' value='".$valuta."' />";
....other fields
//the code for the button (not submit)
$code .= "<td><input type='button' value='Save' onclick='jSaved(".$record['TD001_SEQ']."); '/></td>";
//the label DIV with the same reference of the form/record updating
$code .= "<td><div id='res_".$record['TD001_SEQ']."' ></div></td>";

2) кодът на javascript

  function jSaved(td001){

        //searching for exact form from the document page
        var form = false;
    var length = document.forms.length;
    for(var i = 0; i < length; i++) {
      if(document.forms[i].id == "frm_" + td001) {
        form = document.forms[i];
      }
    }

    //create a string containing all key/values from the form (parameters)      
        length = form.length;
        var sParams = "";

        for(var i = 0; i < length; i++) {
          //will be key1=val1&key2=val2 ....
          sParams = sParams + form.elements[i].id + "=" + form.elements[i].value + "&";

    }

    //execute the php update function with params in POST, td001 is needed to write le DIV label after update       

        var updResult = updateRecord("upd.php", sParams, td001);


  }

    //ajax code
  function updateRecord(strUrl, params, idDiv) {
    var xmlHttpReq = false;

    if (window.XMLHttpRequest) {
      xmlHttpReq = new XMLHttpRequest();
    }
      else if (window.ActiveXObject) {

      xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
    }


    xmlHttpReq.open('POST', strUrl, true);


    xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');


    xmlHttpReq.send(params);


    xmlHttpReq.onreadystatechange = function() {

        /*state evaluation
        * 0 - UNINITIALIZED
        * 1 - LOADING
        * 2 - LOADED
        * 3 - INTERACTIVE
        * 4 - COMPLETE*/

        //state complete
        if (xmlHttpReq.readyState == 4) {
                //updating the DIV label with upd.php result 
                document.getElementById('res_' + idDiv).innerHTML = xmlHttpReq.responseText;
        } 


    }

    return resUpd;
  }


</script>

3) страницата upd.php

if (isset($_POST)) {      
  funFormTaglieOK($_POST);
} else {
  echo "Denied";
}

function funFormTaglieOK($params){
  global $dbdw_usr, $dbdw_pwd, $dbdw_SID;
    // Try to connect to Oracle
  if ($conn = OCILogon($dbdw_usr, $dbdw_pwd, $dbdw_SID)) {
   //execute record update
   if (recordupdate is ok){
    echo "Update"
   } else {
    echo "Error" 
   }

  }
}

person Andrea    schedule 19.08.2015    source източник


Отговори (1)


Добре, така че трябва да използвате ajax и не използвайте target=_blank.

Ако искате нов прозорец, пак можете да го отворите с Javascript.

Във вашия PHP код, който се извиква от ajax повикване, трябва да върнете правилните резултати във формат JSON. Трябва да анализирате този низ в JS и съответно да направите своята актуализация на DOM.

person SalDev    schedule 19.08.2015
comment
Благодаря SalDev за бързия ви отговор, но вероятно не съм обяснил проблема си правилно, функцията, както е описана, в момента правете 2 неща отделно: 1 е php, извикан от действието във формуляр и актуализирайте записа, но ми покажете отговора в отделен прозорец, 2 в събитието onclick, което ми показва запазено там, където имам нужда. Това, което искам, е да стартирам актуализацията на записа от събитието onclick, което ще покаже в елемента DIV правилния отговор (не в отделен прозорец), така че трябва да знам, че мога да използвам $_POST на формуляра от JS кода, Благодаря.. - person Andrea; 19.08.2015
comment
да, премахване на целта _blank, нямам нова страница, но главната страница с всички извлечени записи сега ще бъде пресъздадена и не е това, от което се нуждая.. Главната страница с целия набор от резултати трябва винаги да е една и съща и натискането на единичен бутон за актуализиране за всеки запис, само етикетът DIV трябва да се актуализира с индикацията, запазена до записа, така че функцията onClick JS трябва да изпълни php кода за актуализиране на записа, без да отваря нова страница или да пресъздава съществуващата, само получаване на резултата от операцията и го поставете в етикета, надявам се, че е ясно - person Andrea; 19.08.2015
comment
Да, затова ви препоръчвам да използвате ajax. Можете да изпратите един набор от данни на ajax заявка и да актуализирате точния DIV с резултата от операцията от страна на сървъра. Не е нужно да изграждате отново която и да е част от DOM, просто актуализирайте вътрешната HTML стойност на подходящия DIV с резултатния текст. - person SalDev; 19.08.2015
comment
Благодаря SalDev, проблемът ми е, че съм стар програмист и точно сега чета за AJAX.. но намерих връзка с пример, който ми помага да разбера какво точно е AJAX и този код ми помогна: danieletabacco.com/un-semplice-esempio-di-ajax - person Andrea; 20.08.2015