My menu links uses a jQuery script to load various HTML scripts into a div on an index.php page. Menu item 'Info' puts in sectionInfo.html into the index.php page. This script contains a short form and can bring up an alert() to the user if they misuse the form. But when the alert is accepted the page reloads to the default index.php and then the user has to select Info from the menu again to return to where the form is. How can I re-load the correct div again from the alert?
jQuery script for the menu links:
$('.trigger').click(function(){
var url = $(this).attr('href');
$('#target').load(url)
The menu link:
<ul>
<li>
<a href="sectionInfo.html" class="trigger">Info</a>
</li>
</ul>
The Alert:
function validateMyForm1() {
alert("Alert goes here ");
window.location = 'href="sectionInfo.html" class="trigger"';
}
The div in the body of the index.php
<div id="target"></div>
I have checked other posts and tried various alternatives. Please help and if you down click me please tell me why as I have been down clicked often and don't know why. Thank you.
https://codereview.stackexchange.com/questions/64192/loading-div-sections-from-separate-files
calling jquery from a javascript function
Go to URL after OK button in alert is pressed
The jQuery script is part of longer script which I include in this edit: The lower part of which slide down text the html files.
$('.trigger').click(function(){
var url = $(this).attr('href');
$('#target').load(url, function() {
$('#faqs h1').each(function() {
var tis = $(this), state = false, answer = tis.next('div').hide().css('height','auto').slideUp();
tis.click(function() {
state = !state;
answer.slideToggle(state);
tis.toggleClass('active',state);
});
});
});
return false;
});
1 Answer 1
A couple of issues in your JS, in your first example you need to call preventDefault() on the event to stop the link being followed:
$('.trigger').click(function(e) {
e.preventDefault();
$('#target').load($(this).attr('href'))
});
In the second code sample your string location is entirely wrong, you just need to set the URL to go to as a string. Personally I prefer to do this using the assign() method, like this:
function validateMyForm1() {
alert("Alert goes here");
window.location.assign('sectionInfo.html');
}
window.location = 'href="sectionInfo.html" class="trigger"';