-1

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;
});
Community
  • 1
  • 1
Charles Haughey
  • 61
  • 10
  • 5
    What on earth are you trying to do here?: `window.location = 'href="sectionInfo.html" class="trigger"';` – David May 12 '16 at 14:58
  • I was trying various possibilities. Thank you for pointing out what might be wrong. – Charles Haughey May 12 '16 at 15:38
  • Again I'm down voted and I don't know why. What's the point in down voting if you don't say why. Nothing changes, nothing is gained by me in my understanding so as to avoid it again. – Charles Haughey May 12 '16 at 15:39

1 Answers1

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');
}
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
  • I tried your suggestions but I may not have been able to integrate your top code properly as my jQuery code was part of a longer scrip which I did not include as it has different functionality (sliding text).... the default index.php file continues to come in. Can you please re-look at my edited question and see the full jquery and make a suggestion. Thank you. – Charles Haughey May 12 '16 at 15:29
  • I trimmed down my site to the minimum, removed the sliding text, shortened the jQuery to exactly as you described, to test and I still get returned to the initial opening div of index.php. I placed the alert function in various places in the script and I am still being returned to the default div??? – Charles Haughey May 13 '16 at 15:46