0

Does anyone know how to set a new tagName to a tag using Jquery? Let's say i have an HTML document and I want to replace all 'fieldset' width 'div'. Thanks in advance !

Ikke
  • 99,403
  • 23
  • 97
  • 120
pinkbubble
  • 1
  • 1

4 Answers4

3
fs = $("fieldset");
for (i = 0; i < fs.length; i++) {
    var that = $(fs[i]);
    var fieldsetContent = that.html();
    that.replaceWith('<div>'+fieldsetContent+'</div>');
};

or try for overflow this css fix css:

fieldset {
    display: table-column;
}
<!–[if IE]>
fieldset {
    display: block;
}

Than you can set other styles.

jmav
  • 3,119
  • 4
  • 27
  • 27
  • i upgraded my Jquery version, but still it doesnt work... Here is my code /*$("fieldset").each(function(i) { fieldsetContent = $(this).innerHTML(); $("
    " + fieldsetContent +"
    ").replaceAll("fieldset"); });*/     – pinkbubble Nov 04 '09 at 12:37
  • Thanks jmav, i have tried your solution but it didnt work the way i want. When i do an alert of 'fieldsetContent', it does return the content of my fieldset, but when i put it inside my 'replaceWith' funcion parameters, it does not do anything... I can either solve one side of the problem (ok to change my fieldset to div), but when i combine it by adding the fieldset content, nothing happens.... – pinkbubble Nov 04 '09 at 15:47
  • I tried codemyself and it works. Plase send whole unmodified page and page you would like to have. I will try to help you. Do you use firebug?? – jmav Nov 05 '09 at 12:57
  • It's better to use for function and not each. It's faster. Look http://net.tutsplus.com/tutorials/javascript-ajax/10-ways-to-instantly-increase-your-jquery-performance/ section 3 – jmav Nov 05 '09 at 12:59
  • 1
    You can see my fix if it is appropriate for you: http://stackoverflow.com/questions/1673346/fieldset-firefox-overflow-css-fix – jmav Nov 05 '09 at 13:07
0

You can use the replaceWith or the replaceAll functions to replace elements.

You have to manually place the content from the old element to the new element.

$('fieldset').each(function(object){
    var html = this.html(); 
    this.replaceWith('div').html(html)
});

Something like this. The code is not tested.

Ikke
  • 99,403
  • 23
  • 97
  • 120
  • I think you'd need to save the HTML contents before calling replaceWith() first, something like (inside of the obove function body): var h = $(this).html(); $(this).replaceWith('div').html(h); – Klemen Slavič Nov 04 '09 at 11:12
  • I had tried this : $("fieldset").each(function(i) { var fieldsetContent = $(this).html(); $(this).replaceWith("
    " + fieldsetContent + "
    "); }) but it did not work the way i expected... Any ideas?     – pinkbubble Nov 04 '09 at 12:20
  • Actually, im using jquery-1.js, and it returns an error that says that html() is not a function... – pinkbubble Nov 04 '09 at 12:23
0

Maybe it's less complicated and more effective to try and solve the root of the problem. I can't imagine that there is something hard-coded into Firefox that causes fieldsets to be cut off. I'm 99% sure this can be helped with some CSS. Maybe there you can find more info, or more on-the-spot help, in Mozilla's forums? Maybe examining fieldsets and divs with firebug, and comparing their settings one by one, helps?

Pekka
  • 442,112
  • 142
  • 972
  • 1,088
  • Hi, i already tried all this... The problem has been reported but the solutions given did not solve my problem. But the point of my post is to find out if there is a way to replace a tagname and keep its content. – pinkbubble Nov 04 '09 at 15:42
0

I don't know what kind of environment you're in, but maybe the easiest thing would be to set up a "print view" page that dynamically reads the original HTML page and does a low-level replacement in the source code?

In PHP, it would look like this:

$body = str_replace("<fieldset>", "<div>", $body);
$body = str_replace("</fieldset>", "</div>", $body);

Very low level but could work if the HTML is clean.

Pekka
  • 442,112
  • 142
  • 972
  • 1,088
  • You could get problems with IE browsers, tag must be generated fully before content is added. – jmav Nov 05 '09 at 12:55
  • No, I mean pre-processing the HTML entirely before it is output to the browser. Or do you mean something else? – Pekka Nov 05 '09 at 14:36