Why jQuery Ajax send Get request before of Post?

Question

I want to pass my combobox value on button click event in ASP.Net Mvc but it send get request first then send post request. But I don't want to send Get request.

<script type="text/javascript">
    $(function () {
        $("#btnSave").click(function () {
            $.ajax({
                url: '@Url.Action("ExportButton")',
                type: 'POST',
                data: {
                    Parameter: mycombobox.GetValue()
                }
            });
            $('#btnSave').unbind('click');
            return false;
        });
    });
</script>

Any idea?

Edit:

Here is my button:

@Html.DevExpress().Button(itemSettings =>
{
    itemSettings.Width = 150;
    itemSettings.Styles.Native = true;

    itemSettings.Name = "btnSave";
    itemSettings.Text = "Save";
    itemSettings.UseSubmitBehavior = false ;
    itemSettings.RouteValues = new { Controller = "Report", Action = "ExportButton"};
}
).GetHtml()

Combobox:

@Html.DevExpress().ComboBox( itemSettings =>
{

    var properties = itemSettings.Properties;
    properties.Caption = "Save As ";
    properties.Items.Add("PDF", "PDF");
    properties.Items.Add("EXCEL", "EXCEL");
    properties.Items.Add("CSV", "CSV");
    itemSettings.Name = "mycombobox";

    properties.ValueType = typeof(string);
}
).GetHtml()

Edit 2:

I realised that my jquery send "get" method before "Post" method.

Thanks in advance.

immediate solution is to have ajax in a `if(mycombobox.GetValue()){}` — Ishank, Aug 10 '17 at 12:27
are you somehow preventing the default action of the button? It may be submitting the form too? — Lelio Faieta, Aug 10 '17 at 12:30
I am working on Devexpress and I posted my Button and Combobox. — pseudocode, Aug 10 '17 at 12:46

score 0 · Answer 1 · answered Aug 10 '17 at 12:28

0

did you had tried this way?

<script type="text/javascript">
    $(function () {
        $("#btnSave").unbind().click(function () {//unbind your click event here
            $.ajax({
                url: '@Url.Action("ExportButton")',
                type: 'POST',
                data: {
                    Parameter: mycombobox.GetValue()
                }
            });
        });
    });
</script>

answered Aug 10 '17 at 12:28

KARAN LAGALWAR

227
1
8

1

Thanks for answer but it didn't worked. Same result. – pseudocode Aug 10 '17 at 12:33

score 0 · Answer 2 · answered Aug 10 '17 at 12:32

0

The docs state that click is a shortcut method for .on("click", handler) and suggests using .off("click") for unbinding, instead of unbind(). Give it a try !

answered Aug 10 '17 at 12:32

Salicorne

36
4

derloopkat · Accepted Answer · 2017-08-10T14:50:27.980

0

I don't think your Ajax is running twice. Based on the image you've included, these requests are coming from different sources. The first one is a GET from the document and the second is the Ajax call by POST where you can see it is using XHR. Try to hover over or click on each line in order to get more detailed information.

edited Aug 10 '17 at 14:50

answered Aug 10 '17 at 14:43

derloopkat

6,232
16
38
45

Like you said, problem is the other line in button create part. – pseudocode Aug 10 '17 at 14:50

score 0 · Answer 4 · answered Aug 10 '17 at 14:48

I finally solved the problem.

@Html.DevExpress().Button(itemSettings =>
{
    itemSettings.Width = 150;
    itemSettings.Styles.Native = true;

    itemSettings.Name = "btnSave";
    itemSettings.Text = "Save";
    itemSettings.UseSubmitBehavior = false ;
    itemSettings.RouteValues = new { Controller = "Report", Action = "ExportButton"}; // This line send Get request!
}
).GetHtml()

When I deleted itemSettings.RouteValues line, problem solved.

Why jQuery Ajax send Get request before of Post?

4 Answers4