jQuery/AJAX - Load and unload content into a div when button clicked

Question

I am using this code to include a file (thanks M1K1O):

jQuery Code:

    <script language="javascript">
$(function(){
  $(".classloader").click(function(){
    $("#contenthere").load("/includes/about-info.html");
  });
});
</script>

HTML Code:

<p class="classloader">Click Here</p>
<div id="contenthere"></div>

But I have problems with character encoding. The included file is saved as iso-8859-2, the main html file is too but still I get "bushes".

How can I solve the problem?

And second question: after a click on 'Click here' text from a file is included. I would like the second click to erase the loaded content. Is that possible?

Thank you in advance for your help :)

Karolina

I solved first problem, I think. Looks like included file should be coded as UTF-8 although main file (where I make an inclusion) is coded as iso-8859-2. Strange. Second question is still active. Does anyone know the solution? :-) — Karolina
– Karolina, Commented Oct 28, 2017 at 4:33

Wold · Accepted Answer · 2017-10-28 04:43:00Z

1

You can adapt your event listener to "toggle" on clicking by checking to see if the #contenthere div is populated with your html:

<script language="javascript">
 $(function(){
  $(".classloader").click(function(){
    if($('#contenthere').html() == ""){
      $("#contenthere").load("/includes/about-info.html");
    } else {
      $('#contenthere').html("");
    }
  });
});
</script>

answered Oct 28, 2017 at 4:43

Wold

9721 gold badge13 silver badges25 bronze badges

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

1 Comment

Karolina Over a year ago

Works great. Thank you!

Janen R · Accepted Answer · 2017-10-28 05:12:21Z

0

simply $('#elementId').html(""); is used for clear the elements of the selector

Then,

For empty/clear the input use $('#elementId').val("");

edited Oct 28, 2017 at 5:12

answered Oct 28, 2017 at 4:46

Janen R

7491 gold badge11 silver badges21 bronze badges

1 Comment

Karolina Over a year ago

Thanks! This is it.

Collectives™ on Stack Overflow

jQuery/AJAX - Load and unload content into a div when button clicked

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related