CODEWITHSUNDEEP
jquery
GrantU
GrantU

Reputation: 6555

jQuery change URL of form submit

I want to change the URL the form is submitted to upon click as seen below. Below is what I have tried but it does not work.

<form action="" method="post" class="form-horizontal" id="contactsForm" enctype="multipart/form-data">
  <div class="widget-content">

    <div class="btn-group">
      <button data-toggle="dropdown" class="btn dropdown-toggle">  &nbsp;
        <span class="icon-folder-open icon-large"></span>
        Move To <span class="caret"></span>
      </button>
      <ul class="dropdown-menu">
        {% for x,y in actionsForm.fields.move_to.choices %}
        <li><a class="move_to" id="{{ x }}" href="#">{{ y }}</a></li>
        {% endfor %}

<script>
    $(document).ready(function() {
        $(".move_to").on("click", function () {
            $('#contactsFrom').attr('action', "/test1");
            $("#contactsFrom").submit();
            e.preventDefault();
        });
    });
</script>

Upvotes: 52

Views: 169648

Answers (2)

Viktor Ivliiev
Viktor Ivliiev

Reputation: 1334

Send the data from the form:

$("#change_section_type").live "change", ->
url = $(this).attr("data-url")
postData = $(this).parents("#contract_setting_form").serializeArray()
$.ajax
  type: "PUT"
  url: url
  dataType: "script"
  data: postData

Upvotes: 2

Joe
Joe

Reputation: 15528

Try using this: 

$(".move_to").on("click", function(e){
    e.preventDefault();
    $('#contactsForm').attr('action', "/test1").submit();
});

Moving the order in which you use .preventDefault() might fix your issue. You also didn't use function(e) so e.preventDefault(); wasn't working.

Here it is working: http://jsfiddle.net/TfTwe/1/ - first of all, click the 'Check action attribute.' link. You'll get an alert saying undefined. Then click 'Set action attribute.' and click 'Check action attribute.' again. You'll see that the form's action attribute has been correctly set to /test1.

Upvotes: 121

Related Questions