changing href doesn't work

Question

i like to add query string dynamically in in url. the whole table is from jquery Datatable

when i change select box(on change) , i need to add this value to all anchors in td.so i did that, through following code. when i alert href i getting what i want

("XXX?YY=YY&bsort=ZZ")

. but the anchor href's doesn't have that (&bsort=XX) query string(checking by fire bug) whats wrong ?

mycode

$('select[name="category_table_length"]').change(function(){
    var b,href;
    b = $(this).val();
        $('td a').each(function(){
        href = $(this).attr('href');
        href = href+"&bsort="+b; 

        $(this).attr('href',href);
        });
});

Can you test the href content with `console.log` just before re-assigning it ? (And bring us the result) — Akarun, Mar 11 '11 at 11:31
before assigning :Href =category?id=1&sort=next ...after Href = category?id=1&sort=next&bsort=50 — Gowri, Mar 11 '11 at 11:52

score 1 · Accepted Answer · edited May 23 '17 at 11:47

1

It works for me: http://jsfiddle.net/7QTzt/

Is your HTML valid?

BTW, your code doesn't take into account having to remove a "&bsort" property when you select from the dropdown a second time. Perhaps consider a more sophisticated approach.

edited May 23 '17 at 11:47

Community

1
1

answered Mar 11 '11 at 11:28

Lightness Races in Orbit

378,754
76
643
1,055

yeah i'm also getting result from alone page. in my case the table from jquery data table is that affect – Gowri Mar 11 '11 at 12:13
@gowri: Then the testcase in your question is invalid and you need to provide the actual code that fails. – Lightness Races in Orbit Mar 11 '11 at 12:14

score 0 · Answer 2 · answered Mar 11 '11 at 11:57

try this example:

HTML:

<select name="category_table_length">
    <option value="1">sort 1</option>
    <option value="2">sort 2</option>
    <option value="3">sort 3</option>    
</select>

<table id="mytable">
    <tr>
        <td><a href="/page.php?data=a">anchor 1</a></td>
    </tr>
    <tr>
        <td><a href="/page.php?data=a">anchor 2</a></td>
    </tr>
</table>

JS:

$('select[name="category_table_length"]').change(function(event){

    var 
        actual_value = $(this).val(),
        new_href = "";

    $('#mytable tr td a').each(function(i, el){

        if (!$(el).attr("original_href"))
            $(el).attr("original_href", $(el).attr('href') )

        new_href = $(el).attr("original_href") + "&bsort=" + actual_value;

        $(el)
            .attr('href', new_href)
            .html("change " + new_href);

    });
});

if you do not have "?" should change to:

new_href = $(el).attr("original_href") + "?bsort=" + actual_value;

yeah i'm also getting result from alone page. in my case the table from jquery data table is that affect .. any idea ! — Gowri, Mar 11 '11 at 12:14
you could put the html table. the `. html(` I got to see what worked well, because the links are fake — andres descalzo, Mar 11 '11 at 12:27

changing href doesn't work

2 Answers2