locked
how to remove a particular div in another div tag RRS feed

  • Question

  • User1839056048 posted

    Hi,

    In my application iam loading another webpage inside a divtag like below

    $("#ContentPlaceHolder1_txtsource").click(function (e) {
            e.preventDefault();
            $('#divdistance').show();
            $('#divdistance').html('<object data="http://www.xyz.asp" />');  
        });

    this is working fine

    my requirement is to remove a particular div of http://www.xyz.asp

    like this

    $("divdistance").children(".navbar-header").remove();
    but not working

    this should be after loading of http://www.xyz.asp

    how it is possible

    Regards

    Baiju

    Wednesday, June 29, 2016 11:33 AM

Answers

  • User475983607 posted

    Use JQuery load instead.  That should allow you to query the HTML.

    I believe the previous method should  also work.  Are you sure you are using the correct selector?

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 29, 2016 5:20 PM
  • User-474980206 posted

    you should probably use an iframe instead then you can use the frames contentDocument to access the dom. you will need CORS support to access the dom. 

    Note: if you need to support IE11, due to an IE bug, you may run into issues using jQuery to access the iframe dom. The effects sizzle.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 29, 2016 9:28 PM

All replies

  • User2036436350 posted

    Hi klbaiju,

    You can try with the code below,

    $("#ContentPlaceHolder1_txtsource").click(function (e) {
        e.preventDefault();
        $('#divdistance').show();
        $('#divdistance').html('<object data="http://www.xyz.asp" />').after(function(){
    
    	// Your div removal code goes here.
    	// eg. 
    	// 	$("#divdistance").children(".navbar-header").remove();
    
        });
    });

    Happy Coding!
    Praneeth

    Wednesday, June 29, 2016 11:52 AM
  • User1839056048 posted

    your code is not working

    Wednesday, June 29, 2016 1:05 PM
  • User475983607 posted

    Use JQuery load instead.  That should allow you to query the HTML.

    I believe the previous method should  also work.  Are you sure you are using the correct selector?

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 29, 2016 5:20 PM
  • User-474980206 posted

    you should probably use an iframe instead then you can use the frames contentDocument to access the dom. you will need CORS support to access the dom. 

    Note: if you need to support IE11, due to an IE bug, you may run into issues using jQuery to access the iframe dom. The effects sizzle.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 29, 2016 9:28 PM
  • User2036436350 posted

    Hi klbaiju,

    What i suggested was an idea and not the exact way of how to achieve it as the solution may vary based on the libraries you use.

    Nevertheless, below is a sample code that simulates your problem of loading content from a different source and manipulating it (removing a div) after the content is added to the DOM.

    https://plnkr.co/edit/mZ86VWteImKpYYzrnQZe?p=preview 

    However please note, you should be fine if you are loading partial pages from the same domain, if not you may run into cross domain issues.

    Happy Coding!
    Praneeth

    Thursday, June 30, 2016 5:16 AM
  • User61956409 posted

    Hi klbaiju,

    I agree with bruce, you could try to use <iframe> tag to embed another document within the current HTML document instead of using <object> tag. Then you could access html elements from <iframe> and hide particular elements you want.

    $('#divdistance').html('<iframe src="http://www.xyz.asp"></iframe>');

    Best Regards,

    Fei Han

    Friday, July 1, 2016 7:05 AM