Change HTML Form Action from 'HTTPS' to 'HTTP' with JQuery

Question

I have several forms on an HTML page that look like this:

<form class="pagination" action="https://www.myaction.com" method="post">
...
</form>
<form class="pagination" action="https://www.myaction.com" method="post">
...
</form>
<form class="pagination" action="https://www.myaction.com" method="post">
...
</form>

and I want to change the action to http://www.myaction.com. What is the easiest way do this?

I tried this:

$('.pagination').attr('action').replace('https', 'http');

but that didn't work. Any other simple idea's?

charlietfl · Accepted Answer · 2014-11-05 00:49:36Z

3

All you are doing is changing a string, but not affecting the dom elements themselves.

Try:

$('.pagination').attr('action', function( _, action){
    return action.replace('https', 'http');
});

Using the function argument of attr() will loop over all matching selectors providing index and existing value as arguments.

Reference attr( attributeName, function )

edited Nov 5, 2014 at 0:49

answered Nov 5, 2014 at 0:44

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

PeterKA · Accepted Answer · 2014-11-05 01:00:20Z

2

You can use the following:

$(document).ready(function() {
    $('form.pagination').attr('action', function() {
        return this.action.replace(/https:/i, 'http:');
    });
});

function out( sel ) {
     $('.pagination').each(function() {
       $(sel).append( this.action + '\n' );
     });
   }


   $(document).ready(function() {
        out('.before');
        $('form.pagination').attr('action', function() {
            return this.action.replace(/https:/i, 'http:');
        });
        out('.after');
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="pagination" action="https://www.myaction.com" method="post">
...
</form>
<form class="pagination" action="https://www.myaction.com" method="post">
...
</form>
<form class="pagination" action="https://www.myaction.com" method="post">
...
</form>
<pre class="before"><h1>BEFORE</h1></pre>
<pre class="after"><h1>AFTER</h1></pre>

edited Nov 5, 2014 at 1:00

answered Nov 5, 2014 at 0:45

PeterKA

24.7k5 gold badges28 silver badges52 bronze badges

1 Comment

Demonslay335 Over a year ago

Good idea on using regex to account for case, even if it does seem a bit overkill technically.

Thiago Duarte · Accepted Answer · 2014-11-05 01:26:19Z

1

Do it like this:

$('.pagination').each(function() {
    var url = $(this).attr('action').replace('https', 'http');
    $(this).attr('action', url);
});

If you call attr with just one parameter, jQuery will understand you want to read the value. If you call it with two parameters, it'll know you want to set the value.

edited Nov 5, 2014 at 1:26

answered Nov 5, 2014 at 0:43

Thiago Duarte

9419 silver badges21 bronze badges

1 Comment

charlietfl Over a year ago

won't work if forms have different action values, will set them all the same as the value will come from first form encountered

user2755150 · Accepted Answer · 2014-11-05 00:47:03Z

0

They way you did it is wrong, should be:

$('.pagination').attr('action', $('.pagination').attr('action').replace('https', 'http'));

answered Nov 5, 2014 at 0:47

user2755150

Collectives™ on Stack Overflow

Change HTML Form Action from 'HTTPS' to 'HTTP' with JQuery

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related