Ajax 生成的表单也有 ajax 调用

发布于 2024-11-18 08:03:52 字数 11176 浏览 1 评论 0原文

你好,Stackoverflow!,

好吧,这个问题可能很长,但首先我要写下我想要完成的任务。

我有一个带有“区域”(国家/地区)的下拉菜单,当选择一个区域时,有一个onchange函数,它获取值并转到 AJAX函数,回显结果的php文件(该地区的客户端),并且此结果还回显每个客户端的表单,该表单基本上是一个删除和编辑按钮

当我点击编辑时,这也是一个AJAX调用功能,它回显了我可以编辑注册表的另一种形式。

index.php中的脚本

<script type="text/javascript">
        function showUser(str){
            if (str=="")
              {
              document.getElementById("mostrarClientes").innerHTML="";
              return;
              } 
            if (window.XMLHttpRequest)
              {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest();
              }
            else
              {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
            xmlhttp.onreadystatechange=function()
              {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("mostrarClientes").innerHTML=xmlhttp.responseText;
                }
              }
            document.getElementById("mostrarClientes").innerHTML='Espere un momento porfavor...';  
            xmlhttp.open("GET","verClientesAjax.php?ver="+str,true);
            xmlhttp.send();
        }

        function editUser(str){
            if (str=="")
              {
              document.getElementById("editarClientes").innerHTML="";
              return;
              } 
            if (window.XMLHttpRequest)
              {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest();
              }
            else
              {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
            xmlhttp.onreadystatechange=function()
              {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("editarClientes").innerHTML=xmlhttp.responseText;
                }
              }
            document.getElementById("editarClientes").innerHTML='Espere un momento porfavor...';  
            xmlhttp.open("GET","editarClientesAjax.php?edit="+str,true);
            xmlhttp.send();
        }
</script>

这是我的index.php //索引页面

<form name="form2">
   <select name="regiones" onchange="showUser(this.value)">
   <option>Seleccione una region</option>
     <?php
        while($row = mysql_fetch_assoc($resultRegion)){             
           echo "<option value=\"".$row['idRegion']."\">".$row['nombre']."</option><br/>";
        }
     ?>
    </select>
</form>
<br />
<div id="mostrarClientes"><b>clients by region</b></div>
<div id="editarClientes"><b>form to edit the client</b></div>

这是我的verCliente.php //这是第一个ajax调用我在该区域显示客户端的位置

<?php
mysql_connect("localhost", "user", "pass") or die(mysql_error());
mysql_select_db("db_clients") or die(mysql_error());
header("Content-type: text/html; charset=windows-1252");

//////THIS IS THE FUNCTION THAT PRINTS THE FORM TO EDIT (IT'S IN THE RETURN)    
function repr($pair){
    list($a, $b) = $pair;
return "<form name=\"formEdit$b\"> <div style=\"float:left; margin-right:3px\">&#149; $a</div> <div style=\"float:right\"> <input type=\"image\" name=\"edit\" src=\"edit.gif\" border=\"0\" title=\"editar\" value=\"$b\" onClick=\"editUser(this.value)\"></> <input type=\"image\" name=\"del\" src=\"delete.gif\" border=\"0\" title=\"eliminar\" value=\"$b\" onClick=\"if (!confirm('seguro que desea ELIMINAR el registro \'$a\' ?')) {return false} else{delUser(this.value)}\"></> </div> </form>"; 
}
////////////////////

//////codigo para mostrar clientes  
$numReg=$_GET["ver"];

$nombreProvincia = "";
$nombreComuna = "";
$nombreGiro = "";
$nombreNombre = array();

$resultRegion = mysql_query("SELECT idRegion, nombre FROM region WHERE idRegion = '$numReg'");
$titleRegion= mysql_fetch_array($resultRegion);
$resultClientes = mysql_query("SELECT nombre.idNombre AS idNombre, nombre.nombre AS nombreNombre, comuna.nombre AS nombreComuna, giro.nombre AS nombreGiro, provincia.nombre AS nombreProvincia, provincia.region_idRegion AS idRegion FROM nombre INNER JOIN comuna ON nombre.Comuna_idComuna = comuna.idComuna INNER JOIN giro ON nombre.Giro_idGiro = giro.idGiro INNER JOIN provincia ON comuna.Provincia_idProvincia = provincia.idProvincia WHERE provincia.region_idRegion = '$numReg' ORDER BY nombreProvincia, nombreComuna, nombreGiro, nombreNombre");   
$num_results = mysql_num_rows($resultClientes);

echo '<h2>'.$titleRegion['nombre'].'</h2>';

if ($num_results > 0){  
    while ($row = mysql_fetch_assoc($resultClientes)) {
        if ($nombreProvincia == $row['nombreProvincia']) {
            if ($nombreComuna == $row['nombreComuna']) {
                if ($nombreGiro == $row['nombreGiro']) {
                    $nombreNombre[] = $row['nombreNombre'];
                    array_push($nombreNombre,$row['idNombre']);
                }
                else { //nombreGiro
                    $nombreNombre = array_chunk($nombreNombre, 2);
                    $nombreNombre = array_map("repr", $nombreNombre);
                    echo '<td style="background-color: #CCCCFF">' .implode('<br />', $nombreNombre).'';
                    $nombreGiro = $row['nombreGiro'];
                    echo '</ul></td></tr><tr><td style="background-color: #FFF084">'.$nombreGiro.'</td>';
                    $nombreNombre = array($row['nombreNombre']);
                    array_push($nombreNombre,$row['idNombre']);
                }
            }
            else { // nombreComuna
                $nombreNombre = array_chunk($nombreNombre, 2);
                $nombreNombre = array_map("repr", $nombreNombre);
                echo '<td style="background-color: #CCCCFF">' . implode('<br />', $nombreNombre).'</td></tr>';
                $nombreComuna = $row['nombreComuna'];
                echo '<tr><td colspan="2" style="background-color: #FFCC00"><h4 style="margin: 0">'.$nombreComuna.'</h4></td></tr>';
                $nombreGiro = $row['nombreGiro'];
                echo '<tr><td style="background-color: #FFF084">'.$nombreGiro.'</td>';
                $nombreNombre = array($row['nombreNombre']);
                array_push($nombreNombre,$row['idNombre']);
            }
        }
        else { // nombreProvincia
            if (!empty($nombreNombre)) {
                $nombreNombre = array_chunk($nombreNombre, 2);
                $nombreNombre = array_map("repr", $nombreNombre);
                echo '<td style="background-color: #CCCCFF">' . implode('<br />', $nombreNombre).'</td></tr></table>';
            }

            $nombreProvincia = $row['nombreProvincia'];
            echo '<table cellspacing="1" style="background-color:#000000; float:left;margin-right:10px"><tr><td colspan="2" style="background-color: #FF6600; text-align:center"><h3 style="margin: 0">'.$nombreProvincia.'</h3></td></tr>';
            $nombreComuna = $row['nombreComuna'];
            echo '<tr><td colspan="2" style="background-color: #FFCC00"><h4 style="margin: 0">'.$nombreComuna.'</h4></td></tr>';
            $nombreGiro = $row['nombreGiro'];
            echo '<tr><td style="background-color: #FFF084">'.$nombreGiro.'</td>';
            $nombreNombre = array($row['nombreNombre']);
            array_push($nombreNombre,$row['idNombre']);
        }
    }
    if (!empty($nombreNombre)) {
        $nombreNombre = array_chunk($nombreNombre, 2);
        $nombreNombre = array_map("repr", $nombreNombre);
        echo '<td style="background-color: #CCCCFF">' . implode('<br />', $nombreNombre).'</td></tr></table>';  
    }
}
        else{echo '<p>ningun dato fue encontrado aqui!</p>';}


?>

这是我的 editCliente.php // 这是嵌套的 ajax 调用,我在其中编辑客户端信息

<?php
mysql_connect("localhost", "user", "pass") or die(mysql_error());
mysql_select_db("db_clients") or die(mysql_error());
header("Content-type: text/html; charset=windows-1252");

$regEdit=$_GET["edit"];

//////dropbox results para EDITAR  
$resultComunaEdit = mysql_query("SELECT idComuna, nombre FROM comuna ORDER BY nombre ASC");
$resultGiroEdit = mysql_query("SELECT idGiro, nombre FROM giro ORDER BY nombre ASC");
/////////////////////
$editSql=mysql_query("SELECT nombre.idNombre AS idNombre, comuna.nombre AS comuna, giro.nombre AS giro, nombre.nombre AS nombre FROM nombre INNER JOIN comuna ON nombre.Comuna_idComuna = comuna.idComuna INNER JOIN giro ON nombre.Giro_idGiro = giro.idGiro WHERE idNombre = '$regEdit'");
$rowEdit = mysql_fetch_array($editSql);

$regName=$rowEdit['nombre'];
$regComuna=$rowEdit['comuna'];
$regGiro=$rowEdit['giro'];

echo '<h3>========================EDITAR CLIENTES====================================</h3>';
echo 'editando registro numero: '.$regEdit.'';
echo "<form name=\"editor\" method=\"POST\" action=\"".$_SERVER['PHP_SELF']."\"><div align=\"center\">";
echo "NOMBRE CLIENTE (max 16): <input name=\"nombreNuevo\" type=\"text\" maxlength=\"16\" size=\"25\" value=\"".$regName."\"></>";
echo "GIRO: ";
echo "<input name=\"giroNuevo\" type=\"text\" style=\"background-color:#CFCFCF\" maxlength=\"16\" size=\"15\" value=\"".$regGiro."\" readonly=\"readonly\"></>";

echo "<select name=\"giroEdit\"><option value=\"\">CAMBIAR A:</option>";
    while($row = mysql_fetch_assoc($resultGiroEdit)){
        echo "<option value=\"".$row['idGiro']."\">".$row['nombre']."</option><br/>";
    }
echo "</select>";

echo "COMUNA: ";
echo "<input name=\"comunaNuevo\" type=\"text\" style=\"background-color:#CFCFCF\" maxlength=\"20\" size=\"15\" value=\"".$regComuna."\" readonly=\"readonly\"></>";

echo "<select name=\"comunaEdit\"><option value=\"\">CABIAR A:</option>";   
    while($row = mysql_fetch_assoc($resultComunaEdit)){
        echo "<option value=\"".$row['idComuna']."\">".$row['nombre']."</option><br/>";
    }
echo "</select>";

echo "<input type=\"submit\" name=\"submitEditar\" value=\"Guardar Cambio\" onClick=\"return confirm('seguro que desea guardar cambios?');\"> </>";
echo "<input type=\"hidden\" value=\"".$regEdit."\" name=\"idEdit\" id=\"idEdit\"/>";
echo "</div></form>";





?>

第一个调用工作完美,我得到了客户端区域,但是当我单击编辑按钮时出现问题。希望你能帮助我,对这个长问题感到抱歉。

以防万一你想知道,当我提交第二个表单来编辑客户信息时,它将使用 post 方法而不是 ajax。

Hello Stackoverflow!,

ok this question might be long, but first of all im going to write what i want to accomplish.

I Have a dropdown menu with 'regions' (of a country), when a region is selected there is a function onchange which gets the value and goes to a AJAX function, the php file that echo the result (which are clients in that region), and this results also echo a form for each client, this form is basically a delete and an edit button.

When I click on edit, this is a AJAX call function too, that echo another form where i can edit the registry.

script in the index.php

<script type="text/javascript">
        function showUser(str){
            if (str=="")
              {
              document.getElementById("mostrarClientes").innerHTML="";
              return;
              } 
            if (window.XMLHttpRequest)
              {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest();
              }
            else
              {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
            xmlhttp.onreadystatechange=function()
              {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("mostrarClientes").innerHTML=xmlhttp.responseText;
                }
              }
            document.getElementById("mostrarClientes").innerHTML='Espere un momento porfavor...';  
            xmlhttp.open("GET","verClientesAjax.php?ver="+str,true);
            xmlhttp.send();
        }

        function editUser(str){
            if (str=="")
              {
              document.getElementById("editarClientes").innerHTML="";
              return;
              } 
            if (window.XMLHttpRequest)
              {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest();
              }
            else
              {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
            xmlhttp.onreadystatechange=function()
              {
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("editarClientes").innerHTML=xmlhttp.responseText;
                }
              }
            document.getElementById("editarClientes").innerHTML='Espere un momento porfavor...';  
            xmlhttp.open("GET","editarClientesAjax.php?edit="+str,true);
            xmlhttp.send();
        }
</script>

this is my index.php //index page

<form name="form2">
   <select name="regiones" onchange="showUser(this.value)">
   <option>Seleccione una region</option>
     <?php
        while($row = mysql_fetch_assoc($resultRegion)){             
           echo "<option value=\"".$row['idRegion']."\">".$row['nombre']."</option><br/>";
        }
     ?>
    </select>
</form>
<br />
<div id="mostrarClientes"><b>clients by region</b></div>
<div id="editarClientes"><b>form to edit the client</b></div>

this is my verCliente.php //this is the first ajax call where i show the clients in the region

<?php
mysql_connect("localhost", "user", "pass") or die(mysql_error());
mysql_select_db("db_clients") or die(mysql_error());
header("Content-type: text/html; charset=windows-1252");

//////THIS IS THE FUNCTION THAT PRINTS THE FORM TO EDIT (IT'S IN THE RETURN)    
function repr($pair){
    list($a, $b) = $pair;
return "<form name=\"formEdit$b\"> <div style=\"float:left; margin-right:3px\">• $a</div> <div style=\"float:right\"> <input type=\"image\" name=\"edit\" src=\"edit.gif\" border=\"0\" title=\"editar\" value=\"$b\" onClick=\"editUser(this.value)\"></> <input type=\"image\" name=\"del\" src=\"delete.gif\" border=\"0\" title=\"eliminar\" value=\"$b\" onClick=\"if (!confirm('seguro que desea ELIMINAR el registro \'$a\' ?')) {return false} else{delUser(this.value)}\"></> </div> </form>"; 
}
////////////////////

//////codigo para mostrar clientes  
$numReg=$_GET["ver"];

$nombreProvincia = "";
$nombreComuna = "";
$nombreGiro = "";
$nombreNombre = array();

$resultRegion = mysql_query("SELECT idRegion, nombre FROM region WHERE idRegion = '$numReg'");
$titleRegion= mysql_fetch_array($resultRegion);
$resultClientes = mysql_query("SELECT nombre.idNombre AS idNombre, nombre.nombre AS nombreNombre, comuna.nombre AS nombreComuna, giro.nombre AS nombreGiro, provincia.nombre AS nombreProvincia, provincia.region_idRegion AS idRegion FROM nombre INNER JOIN comuna ON nombre.Comuna_idComuna = comuna.idComuna INNER JOIN giro ON nombre.Giro_idGiro = giro.idGiro INNER JOIN provincia ON comuna.Provincia_idProvincia = provincia.idProvincia WHERE provincia.region_idRegion = '$numReg' ORDER BY nombreProvincia, nombreComuna, nombreGiro, nombreNombre");   
$num_results = mysql_num_rows($resultClientes);

echo '<h2>'.$titleRegion['nombre'].'</h2>';

if ($num_results > 0){  
    while ($row = mysql_fetch_assoc($resultClientes)) {
        if ($nombreProvincia == $row['nombreProvincia']) {
            if ($nombreComuna == $row['nombreComuna']) {
                if ($nombreGiro == $row['nombreGiro']) {
                    $nombreNombre[] = $row['nombreNombre'];
                    array_push($nombreNombre,$row['idNombre']);
                }
                else { //nombreGiro
                    $nombreNombre = array_chunk($nombreNombre, 2);
                    $nombreNombre = array_map("repr", $nombreNombre);
                    echo '<td style="background-color: #CCCCFF">' .implode('<br />', $nombreNombre).'';
                    $nombreGiro = $row['nombreGiro'];
                    echo '</ul></td></tr><tr><td style="background-color: #FFF084">'.$nombreGiro.'</td>';
                    $nombreNombre = array($row['nombreNombre']);
                    array_push($nombreNombre,$row['idNombre']);
                }
            }
            else { // nombreComuna
                $nombreNombre = array_chunk($nombreNombre, 2);
                $nombreNombre = array_map("repr", $nombreNombre);
                echo '<td style="background-color: #CCCCFF">' . implode('<br />', $nombreNombre).'</td></tr>';
                $nombreComuna = $row['nombreComuna'];
                echo '<tr><td colspan="2" style="background-color: #FFCC00"><h4 style="margin: 0">'.$nombreComuna.'</h4></td></tr>';
                $nombreGiro = $row['nombreGiro'];
                echo '<tr><td style="background-color: #FFF084">'.$nombreGiro.'</td>';
                $nombreNombre = array($row['nombreNombre']);
                array_push($nombreNombre,$row['idNombre']);
            }
        }
        else { // nombreProvincia
            if (!empty($nombreNombre)) {
                $nombreNombre = array_chunk($nombreNombre, 2);
                $nombreNombre = array_map("repr", $nombreNombre);
                echo '<td style="background-color: #CCCCFF">' . implode('<br />', $nombreNombre).'</td></tr></table>';
            }

            $nombreProvincia = $row['nombreProvincia'];
            echo '<table cellspacing="1" style="background-color:#000000; float:left;margin-right:10px"><tr><td colspan="2" style="background-color: #FF6600; text-align:center"><h3 style="margin: 0">'.$nombreProvincia.'</h3></td></tr>';
            $nombreComuna = $row['nombreComuna'];
            echo '<tr><td colspan="2" style="background-color: #FFCC00"><h4 style="margin: 0">'.$nombreComuna.'</h4></td></tr>';
            $nombreGiro = $row['nombreGiro'];
            echo '<tr><td style="background-color: #FFF084">'.$nombreGiro.'</td>';
            $nombreNombre = array($row['nombreNombre']);
            array_push($nombreNombre,$row['idNombre']);
        }
    }
    if (!empty($nombreNombre)) {
        $nombreNombre = array_chunk($nombreNombre, 2);
        $nombreNombre = array_map("repr", $nombreNombre);
        echo '<td style="background-color: #CCCCFF">' . implode('<br />', $nombreNombre).'</td></tr></table>';  
    }
}
        else{echo '<p>ningun dato fue encontrado aqui!</p>';}


?>

this is my editCliente.php // this is the nested ajax call where i edit the client info

<?php
mysql_connect("localhost", "user", "pass") or die(mysql_error());
mysql_select_db("db_clients") or die(mysql_error());
header("Content-type: text/html; charset=windows-1252");

$regEdit=$_GET["edit"];

//////dropbox results para EDITAR  
$resultComunaEdit = mysql_query("SELECT idComuna, nombre FROM comuna ORDER BY nombre ASC");
$resultGiroEdit = mysql_query("SELECT idGiro, nombre FROM giro ORDER BY nombre ASC");
/////////////////////
$editSql=mysql_query("SELECT nombre.idNombre AS idNombre, comuna.nombre AS comuna, giro.nombre AS giro, nombre.nombre AS nombre FROM nombre INNER JOIN comuna ON nombre.Comuna_idComuna = comuna.idComuna INNER JOIN giro ON nombre.Giro_idGiro = giro.idGiro WHERE idNombre = '$regEdit'");
$rowEdit = mysql_fetch_array($editSql);

$regName=$rowEdit['nombre'];
$regComuna=$rowEdit['comuna'];
$regGiro=$rowEdit['giro'];

echo '<h3>========================EDITAR CLIENTES====================================</h3>';
echo 'editando registro numero: '.$regEdit.'';
echo "<form name=\"editor\" method=\"POST\" action=\"".$_SERVER['PHP_SELF']."\"><div align=\"center\">";
echo "NOMBRE CLIENTE (max 16): <input name=\"nombreNuevo\" type=\"text\" maxlength=\"16\" size=\"25\" value=\"".$regName."\"></>";
echo "GIRO: ";
echo "<input name=\"giroNuevo\" type=\"text\" style=\"background-color:#CFCFCF\" maxlength=\"16\" size=\"15\" value=\"".$regGiro."\" readonly=\"readonly\"></>";

echo "<select name=\"giroEdit\"><option value=\"\">CAMBIAR A:</option>";
    while($row = mysql_fetch_assoc($resultGiroEdit)){
        echo "<option value=\"".$row['idGiro']."\">".$row['nombre']."</option><br/>";
    }
echo "</select>";

echo "COMUNA: ";
echo "<input name=\"comunaNuevo\" type=\"text\" style=\"background-color:#CFCFCF\" maxlength=\"20\" size=\"15\" value=\"".$regComuna."\" readonly=\"readonly\"></>";

echo "<select name=\"comunaEdit\"><option value=\"\">CABIAR A:</option>";   
    while($row = mysql_fetch_assoc($resultComunaEdit)){
        echo "<option value=\"".$row['idComuna']."\">".$row['nombre']."</option><br/>";
    }
echo "</select>";

echo "<input type=\"submit\" name=\"submitEditar\" value=\"Guardar Cambio\" onClick=\"return confirm('seguro que desea guardar cambios?');\"> </>";
echo "<input type=\"hidden\" value=\"".$regEdit."\" name=\"idEdit\" id=\"idEdit\"/>";
echo "</div></form>";





?>

the first call work perfectly i get the clients of the region, but when i click on the edit button something goes wrong. hope you can help me, and sorry about the long question.

just in case you wonder, when i submit the second form to edit the client info that's going to be with post method not ajax.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

慈悲佛祖 2024-11-25 08:03:52

问题是我正在使用输入类型图像,所以当单击时,正在刷新网站,并且 onclick 函数没有加载,所以我只是更改了按钮的输入类型图像,然后它就起作用了 =)

the problem was I was using input type image, so when clicked, was refreshing the site, nad the onclick function wasnt loading, so i just changed the input type image for a button and then it worked =)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文