2つの選択フィールドを持つフォームを使用しています。それらの1つは、変更イベントと関連付けられています。私はAjaxを使用してIDを他のPHPドキュメントに送り、データを処理してクエリを実行します。 クエリは正常に動作し、私はfirebugを使用してエコーの結果を確認します。問題は、フォームの自分の( '#municipio')selectにクエリの値を読み込むことができないことです。私を助けてくれませんか?フォーム内の選択内容を入力することができません
1)ここでは私のHTML + JSがある& AJAXコード
<?php
//Activamos el almacenamiento en el buffer
ob_start();
session_start();
if (!isset($_SESSION["nombre"]))
{
header("Location: login.html");
}
else
{
require 'header.php';
if ($_SESSION['gestion']==1)
{
?>
<!--Contenido-->
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Main content -->
<section class="content">
<div class="row">
<div class="col-md-12">
<div class="box">
<div class="box-header with-border">
<h1 class="box-title">Clientes <button class="btn btn-success" id="btnagregar" onclick="mostrarform(true)"><i class="fa fa-plus-circle"></i> Agregar</button></h1>
<div class="box-tools pull-right">
</div>
</div>
<!-- /.box-header -->
<!-- centro -->
<div class="panel-body table-responsive" id="listadoregistros">
<table id="tbllistado" class="table table-striped table-bordered table-condensed table-hover">
<thead>
<th>Opciones</th>
<th>Forma de pago</th>
<th>Provincia</th>
<th>Municipio</th>
<th>T.L. Fiscal</th>
<th>Nombre comercial</th>
<th>Zona</th>
<th>Teléfono</th>
<th>Móvil</th>
<th>Fax</th>
<th>Contacto</th>
<th>Domicilio 1</th>
<th>Domicilio 2</th>
<th>Población</th>
<th>C.P</th>
<th>NIF/CIF</th>
<th>Representante</th>
<th>CCC</th>
<th>IBAN</th>
<th>Recargo Equivalencia (S/N)</th>
<th>Descuento comercial</th>
<th>Descuento pronto pago</th>
<th>Financiación</th>
</thead>
<tbody>
</tbody>
<tfoot>
<th>Opciones</th>
<th>Forma de pago</th>
<th>Provincia</th>
<th>Municipio</th>
<th>T.L. Fiscal</th>
<th>Nombre comercial</th>
<th>Zona</th>
<th>Teléfono</th>
<th>Móvil</th>
<th>Fax</th>
<th>Contacto</th>
<th>Domicilio 1</th>
<th>Domicilio 2</th>
<th>Población</th>
<th>C.P</th>
<th>NIF/CIF</th>
<th>Representante</th>
<th>CCC</th>
<th>IBAN</th>
<th>Recargo Equivalencia (S/N)</th>
<th>Descuento comercial</th>
<th>Descuento pronto pago</th>
<th>Financiación</th>
</tfoot>
</table>
</div>
<div class="panel-body" style="height: 1000px;" id="formularioregistros">
<form name="formulario" id="formulario" method="POST">
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>T.L Fiscal:</label>
<input type="hidden" name="idcliente" id="idcliente">
<input type="text" class="form-control" name="tlfiscal" id="tlfiscal" maxlength="30" placeholder="Razón social de la empresa" required>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Nombre:</label>
<input type="text" class="form-control" name="nombre" id="nombre" maxlength="30" placeholder="Nombre comercial de la empresa">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Zona:</label>
<input type="text" class="form-control" name="zona" id="zona" maxlength="25" placeholder="Zona de la empresa">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Teléfono:</label>
<input type="text" class="form-control" name="telefono" id="telefono" maxlength="15" placeholder="Indicar el nº de teléfono fijo">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Móvil:</label>
<input type="text" class="form-control" name="movil" id="movil" maxlength="15" placeholder="indicar el nº de móvil">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Fax:</label>
<input type="text" class="form-control" name="fax" id="fax" maxlength="15" placeholder="indicar el nº de fax de la empresa">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Contacto:</label>
<input type="text" class="form-control" name="contacto" id="contacto" maxlength="30" placeholder="indicar la persona de contacto">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Provincia:</label>
<select id="provincia" name="provincia" class="form-control selectpicker" data-live-search="true" required>
<option value="">Selecciona la provincia del cliente</option>
</select>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Municipio:</label>
<select id="municipio" name="municipio" class="form-control selectpicker" data-live-search="true" required>
<option value="">Selecciona provincia primero</option>
</select>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Domicilio 1:</label>
<input type="text" class="form-control" name="domicilio1" id="domicilio1" maxlength="60" placeholder="indicar el domicilio de la empresa" required>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Domicilio 2:</label>
<input type="text" class="form-control" name="domicilio2" id="domicilio2" maxlength="60" placeholder="indicar el domicilio alternativo de la empresa si lo hubiera">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Población:</label>
<input type="text" class="form-control" name="poblacion" id="poblacion" maxlength="30" placeholder="indicar la población del cliente" required>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>C.P:</label>
<input type="text" class="form-control" name="cp" id="cp" maxlength="5" placeholder="indicar el código postal del cliente">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>NIF/CIF:</label>
<input type="text" class="form-control" name="idfiscal" id="idfiscal" maxlength="11" placeholder="indicar el NIF o CIF del cliente" required>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Representante:</label>
<input type="text" class="form-control" name="representante" id="representante" maxlength="30" placeholder="Representante del cliente">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Forma de pago:</label>
<select id="idpago" name="idpago" class="form-control selectpicker" data-live-search="true" required></select>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Código Cuenta Cliente:</label>
<input type="text" class="form-control" name="ccc" id="ccc" maxlength="23" placeholder="Indicar nº de cuenta del cliente">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>IBAN:</label>
<input type="text" class="form-control" name="iban" id="iban" maxlength="38" placeholder="Indicar el IBAN del cliente">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>BIC:</label>
<input type="text" class="form-control" name="bic" id="bic" maxlength="11" placeholder="Indicar el BIC del cliente">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Recargo de equivalencia:</label>
<input type="text" class="form-control" name="re" id="re" maxlength="2" placeholder="Indicar si el cliente tiene o no recargo de equivalencia" required>
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Precio aplicable:</label>
<input type="text" class="form-control" name="precioaplicable" id="precioaplicable" maxlength="1" placeholder="Indicar el nº de precio aplicable al cliente">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Días pago:</label>
<input type="text" class="form-control" name="diaspago" id="diaspago" maxlength="25" placeholder="Días de pago del cliente (ej:30/45/60)">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Descuento comercial %:</label>
<input type="text" class="form-control" name="dtocomercial" id="dtocomercial" maxlength="3" placeholder="Indicar solo número, sin %">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Descuento pronto pago:</label>
<input type="text" class="form-control" name="dtoppago" id="dtoppago" maxlength="3" placeholder="Indicar solo número, sin %">
</div>
<div class="form-group col-lg-6 col-md-6 col-sm-6 col-xs-12">
<label>Financiación:</label>
<input type="text" class="form-control" name="financiacion" id="financiacion" maxlength="3" placeholder="Indicar el porcentaje de recargo por financiación (sin %)">
</div>
<div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
<button class="btn btn-primary" type="submit" id="btnGuardar"><i class="fa fa-save"></i> Guardar</button>
<button class="btn btn-danger" onclick="cancelarform()" type="button"><i class="fa fa-arrow-circle-left"></i> Cancelar</button>
</div>
</form>
</div>
<!--Fin centro -->
</div><!-- /.box -->
</div><!-- /.col -->
</div><!-- /.row -->
</section><!-- /.content -->
</div><!-- /.content-wrapper -->
<!--Fin-Contenido-->
<?php
}
else
{
require 'noacceso.php';
}
require 'footer.php';
?>
<script type="text/javascript" src="scripts/clienteok.js"></script>
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//$('#provincia').on('change',function(){
$('#provincia').change(function(data){
data.preventDefault();
var provinciaID = $(this).val();
//var provinciaID = this.value;
var data = {'provinciaID': provinciaID};
if(provinciaID){
//alert(provinciaID);
$.ajax({
type:'POST',
url:'../ajax/clientes.php?op=selectMunicipio',
data: data,
//data:provinciaID={provinciaID : provinciaID},
dataType:'json',
contentType: "application/x-www-form-urlencoded",
success: function(data){
//success:function(html){
$("#municipio").append(data);
$("#municipio").html(data);
$('#municipio').selectpicker('refresh');
}
});
}
});
});
</script>
<?php
}
ob_end_flush();
?>
2)ここで変更イベントのJSで送信されたデータをrecieves PHPファイルは次のとおりです。
は、私は私のコードを投稿します:
ケース "selectMunicipio":私が言ったように
require_once "../modelos/Municipios.php";
$municipio = new Municipio();
//$arrayres = array();
if (empty($_POST['provinciaID']))
{
$provinciaID="1";
}
else {
$provinciaID=$_POST['provinciaID'];
}
$rspta = $municipio->select($provinciaID);
while ($reg = $rspta->fetch_object())
{
echo '<option value=' . $reg->id . '>' . $reg->municipio . '</option>';
}
break;
トン彼はエコーが働いている。 Firebugを使用している応答セクションでは、 Alfoz de LloredoAmpueroなどが表示されます。 私の疑問は、エコーの結果を( '#municipios')に追加するにはどうすればよいのですか?
私は何か間違っていた場合は、事前におかげで申し訳ありません、これは私の最初の投稿です。
データがajax呼び出しから返されると、要素に追加されます。次に、その要素をajax呼び出しのデータで置き換えます。Google Chromeのツールを開き、ajax呼び出しの後にフォーム要素を調べて確認します。 – flauntster
エンドポイントからJSONをエコーしているわけではなく、単純なプレーンテキストです。そのためパーサーは失敗し、 '
ありがとう@テリー¡あなたのヒントは私を解決に導いた。ちょうど私のJSコードから 'json'のデータ型を削除しようとしましたが、今はselectpickerが魅力のように動作します:) –