Submitting two forms in one button - Yii FrameWork - yii

I am trying to submit more than two forms in one button by using JS, how could i proceed to do this for yii active forms.

This is not specific to Yii. You can handle this using javacript. Write a function for on click event of the submit button. serialize the form1, serialize the form2. Concatenate two serialize results and pass it to an ajax request.
$('your_submit_button_selector').on('click', function(event){
event.preventDefault();
formData = $('your_form1_selector').serialize()+$('your_form2_selector').serialize();
$.ajax({
url: submitUrl,
data: formData,
type: 'POST',
success: function(data) {
...
}
});
});

Why don't you use this way...
jQuery('#yourForm1').submit();
jQuery('#yourForm2').submit();
Good Luck.

Related

How to clear the cart using ajax in shopify?

I need to add link on home page or any other page with the help of that link I want to clear all my cart items.
can any one help me with this
You can use Shopify's clear.js API. Follow these steps:
Add a link to clear cart:
Clear Cart
Add this script in your custom JS file:
$('.clear-cart').on('click',function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: '/cart/clear.js',
success: function(){
alert('Cleared the cart!');
},
dataType: 'json'
});
})

datatables.net ajax outside angular scope does not call the interceptor

Angular CLI: 7.3.3 | Node: 10.7.0 | OS: linux x64 | Angular: 7.2.6
I need server side pagination, sorting and filtering, my table will get 100.000 records easily.
Project example -> https://github.com/sibelly/angular-with-datatablesnet
This example consumes themoviedb API, it's just for testing, that is not my real scenario. Here in this project, I don't activate the server side option as I said is just for testing the calling to my interceptor, just to prove that with ajax directly the interceptor isn't called.
On my real scenario, I have a Laravel API, which has the methods that expect the pagination, sorting and filtering params, because I need it to be done server side to reach a better performance and usability.
When I call the API endpoint using HttpClient, it calls my error.interceptor.ts normally, but the pagination, sorting and filtering information isn't passing to the URL.
So, I concluded that I need to call it via Ajax when I call using the ajax the params are sent as expected.
But what happens is that the user token expire and I need to redirect to the login page again. And this is done using the interceptors of angular, that is not activated when calling using ajax directly because it is outside angular's scope.
To resume, how can I intercept my ajax calling from datatables.net framework in my angular project?
Or is there another way to make the server side pagination, sorting and filtering?
movie.component.ts
ngOnInit() {
//When calling this method the error.interceptor is activated normally
//this.getMostPopularMovies();
//But when I call direct using the AJAX, the interceptor doesn't work
this.dtOptions = {
ajax: {
url: 'https://api.themoviedb.org/3/discover/movie?sort_by=popularity.desc&api_key=2ed54a614803785fce2d7fe401cc3b21',
params: {
api_key: this.moviedbService.apiKey
},
dataSrc: 'results'
//type: 'GET',
//headers: {"Authorization": 'Bearer ' + JSON.parse(localStorage.getItem('authUser'))["token"]}
},
columns: [
{ data: 'title' },
{ data: 'release_date' }
]
};
}
getMostPopularMovies(){
this.moviedbService.getMostPopularMovies().
subscribe((movies: any) => {
this.moviesList = movies.results;
console.log("====", movies);
}, (error: any) => {
console.error("Erro-> ", error);
});
}
Thanks, guys o/

Unable to upload form data and file contents on submit

I am attempting to use jQuery-File-Upload for showing the preview of the uploaded image. This is working fine. The code for file upload is as shown below
$('#Image').fileupload({
url : "/FileUpload/Upload",
autoupload:false,
add: function (e, data) {
gm.layout.loaderOpen(); //open loader
data.submit();
},
done: function (e, data) {
console.log("done")
if (data.response().jqXHR.status === 200)
$('#processImage').attr('src', data.response().jqXHR.responseText);
},
always: function (e, data) {
gm.layout.loaderClose();
}
})
However apart from the image preview the form also has other fields which the user fills up and then submits the form. Now I am trying to use ajax to submit and collect the data by serialzing the form
var formData = $('form').serializeArray();
$.ajax({
type:"POST",
url: "{url}",
data: formData,
contentType: false,
processData:false,
success: function (data) {
alert("whatever");
}
});
This ajax submit fails as long as I have the fileupload for the html input control. With the file upload the multimedia data doesn't reach the server on submit
However, in the absence of fileupload for the same control, everything works fine and I can get the file content on the server.
Any idea what I am doing wrong?

Call controller of a project from a diff project using jQuery Ajax

Can we call a controller of one project from another project using Jquery Ajax, MVC4?
If we can, how to do that?
I have tried the below but it is not working:
$.ajax({
url: "/test/Testing",
dataType: "json",
data: {
//We need to send some in future...
},
success: function (data) {
$("div[data-stage = \"stagerWidget\"]").html(data.results[0]);
return;
}
});
This is solved by specifying type of request (get or post).

How to POST data to a server in Sencha Touch without using AJAX

I am using Sencha Touch, I need post some data to a Server with a simple HTTP POST (NO AJAX)
At the moment I use
Ext.data.JsonP.request
Ext.Ajax.request
for my understanding both work with AJAX.
I would like to know how to disable the AJAX functionality and allow me to send some paramenters only via HTTP without using xhr and ajax.
You can create a form panel and then call the submit method with a url for the form to be submitted to:
// define your form
var form = Ext.create('Ext.form.Panel', {
...
// your form fields, etc
});
// later, in some handler for a button click, etc
form.submit({
url: 'url/to/submit.php',
method: 'POST',
success: function() {
// handle successful form submit
},
failure: funciton() { ... }
});