Jump to content

Submit un formulario en background con ajax duda


Recommended Posts

Hola, tengo el siguiente problema, necesito que un formulario haga un submit en background, eh indagado y encontré una forma de hacerlo con ajax pero necesito el parametro url y data que no se como sacarlos ya que el formulario es este:

 

<form id="makePdfCatalogue" name="makePdfCatalogue" method="POST"  enctype="multipart/form-data">
	<div class="row">
		<div class="col-md-6">
			<fieldset>
			<legend>Categorías</legend>
			<div class="form-group">
				<label class="" for="name">{l s="Selecciona la categoría/s que deseas exportar" mod="custompdfexport"}</label>
				{$categories_tree}
			</div>
			</fieldset>
		</div>
		<div class="col-md-6">
			<fieldset>
			<legend>Datos empresa</legend>
	<div class="row">
		<div class="col-md-12">
			<div class="form-group">
				<label class="" for="name">Nombre Empresa</label>
					<input type="text" name="name" placeholder={l s="Nombre Empresa..." mod="custompdfexport"}
					class="form-control" id="name">
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="form-group">
				<label class="" for="contact">Datos contacto</label>
					<input type="text" name="contact" placeholder={l s="Datos Contacto..." mod="custompdfexport"}
					class="form-control" id="contact">
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="form-group">
				<label class="" for="logo">Logo empresa</label>
					<input type="file" name="logo" placeholder={l s="logo Empresa..." mod="custompdfexport"}
					class="form-control" id="logo">
			</div>
		</div>
	</div>
	</fieldset>
	<fieldset>
		<legend>Opciones</legend>

	<div class="row">
		<div class="col-md-3">
			<div class="form-group">
				<label class="" for="form-password">{l s="Diseño" mod="custompdfexport"}</label>
				<ul>
					<li>	
						<input type="radio" name="format" class="form-control"  value="2" id="format-2"><label for="format-2">{l s="2 columnas" mod="custompdfexport"}</label>
					</li>
					<li>
						<input type="radio" name="format" class="form-control"  value="3" id="format-3"><label for="format-3">{l s="3 columnas" mod="custompdfexport"}</label>
					</li>
					<li>
						<input type="radio" name="format" class="form-control"  value="4" id="format-4"><label for="format-4">{l s="4 columnas" mod="custompdfexport"}</label>
					</li>
				</ul>	
			</div>
		</div>
		<div class="col-md-5">
			<div class="form-group">
				<label class="" for="form-password">Opciones</label>
					<div class="form-group"><input type="checkbox" name="options[]" class="form-control" id="opt-wt" value="wt"><label for="opt-wt">{l s="Mostrar Precios con Iva" mod="custompdfexport"}</label></div>
					<div class="form-group"><input type="checkbox" name="options[]" class="form-control" id="opt-wot" value="wot"><label for="opt-wot"> {l s="Mostrar Precios sin Iva" mod="custompdfexport"}</label></div>
					<div class="form-group"><input type="checkbox" name="options[]" class="form-control" id="opt-ref" value="reference"><label for="opt-ref">{l s="Mostrar referencia" mod="custompdfexport"}</label></div>
					<div class="form-group"><input type="checkbox" name="options[]" class="form-control" id="opt-link" value="link"><label for="opt-link">{l s="Enlazar productos con web" mod="custompdfexport"}</label></div>
			</div>
		</div>
		<div class="col-md-4">
			<div class="form-group">
				<label class="" for="revenue">Margen comercial (%)</label>
					<input type="text" name="revenue" placeholder={l s="Margen comercial..." mod="custompdfexport"}
					class="form-control" id="revenue" style="width: 100px;">
			</div>
			<div class="form-group">
				<label class="" for="revenue">Descuento (%)</label>
					<input type="text" name="reduction" placeholder={l s="Descuento..." mod="custompdfexport"}
					class="form-control" id="reduction" style="width: 100px;">
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-6">
				<label class="" for="form-password">Ordenar</label>
				<div class="form-group"><input type="radio" name="order" class="form-control" id="order-asc" value="price_asc"><label for="order-asc">{l s="Por precio de Menor a Mayor" mod="custompdfexport"}</label></div>
				<div class="form-group"><input type="radio" name="order" class="form-control" id="order-desc" value="price_desc"><label for="order-desc">{l s="Por precio de Mayor a Menor" mod="custompdfexport"}</label></div>
		</div>
		<div class="col-md-6">
				<label class="" for="form-password">Stock</label>
				<div class="form-group"><input type="checkbox" name="stock" class="form-control" id="stock" value="stock"><label for="stock">{l s="Seleccionar sólo artículos con stock"}</label></div>
		</div>
	</div>
	</fieldset>
	<br>
	<input type="hidden" name="token" value="{$token|escape:'html':'UTF-8'}" />
	<input type="submit" name="submitMakePdfCatalogue" id="submitMakePdfCatalogue" value="{l s='Generar' mod='custompdfexport'}" class="exclusive" />

	</div>
	</div>
</form>

 

 y la forma de hacerlo con ajax seria algo parecida a esta:

 

<script language="javascript">
    $(document).ready(function() {
        $("#makePdfCatalogue").submit(function(e) {
          	e.preventDefault();
            var dataString = $("#makePdfCatalogue").serialize(); // de esta manera no puedo
            $.ajax({
                type: "POST",
                url: "", //no aparece action en el form
                data: dataString,
                success: function(msg) {
                     
                    console.log('working: '+msg);
                },
                error: function(msg) {
                      
                    console.log('not working '+msg);
                }
            });
        })
    })
</script>

Por favor alguna sugerencia lo agradeceria mucho, Saludos.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...