Issue
I have a click event which fires when I click on a button, it opens a modal interface:
$(".profileF2fClinicalServiceDetails").live("click", function(){
var requestUrl = '/php/includes/ajax.php?operation=profile_edit_f2f_clinical_service_details&service=f2f&counsellor_id='+getPractitionerId($(this))+'&counsellor_address_id='+getAddressId($(this))+'&edit_level='+getEditLevel($(this))+'&tab='+getTab($(this));
openDialog(requestUrl, "Edit Face to Face Service Details", 850, "location.replace(getCleanedLocationHref()+'&tab="+getTab($(this))+"');");
return false;
});
But now I want to prompt this to be fired when a page loads, how do I call it directly from the HTML?
Solution
Add the code in the click event to an independent function (rather than a closure) called, for example, showPopup
. Then change the function bound to the click event to call showPopup
, and add a call to showPopup
function on page load.
A note, as of 1.7 jQuery's live
function is deprecated, you should use on
instead (source)
You will have to pass some arguments to the function, since you won't be able to use this
during the initial call. You will have to pass those arguments to the main function the first time you call it, I won't presume to guess how you'll determine that.
When the click event is fired, you can extract the arguments from the element in the fashion you're currently using. You'd have something like this:
$(document).ready(function() {
// add the click event
$(".profileF2fClinicalServiceDetails").on("click", function () {
var Me = $(this);
showPopup(
getPractitionerId(Me),
getAddressId(Me),
getEditLevel(Me),
getTab(Me)
);
});
// call the function right away
showPopup(
[initial_counsellor_id],
[initial_address_id],
[initial_level],
[initial_tab]
);
});
function showPopup(counsellor_id, address_id, level, tab) {
var requestUrl = '/php/includes/ajax.php?operation=profile_edit_f2f_clinical_service_details&service=f2f&counsellor_id='+counsellor_id+'&counsellor_address_id='+address_id+'&edit_level='+level+'&tab='+tab;
openDialog(
requestUrl,
"Edit Face to Face Service Details",
850,
"location.replace(getCleanedLocationHref()+'&tab="+tab+"');"
);
return false;
}
Documentation and Related Reading
jQuery.ready
- http://api.jquery.com/ready/jQuery.on
- http://api.jquery.com/on/jQuery.live
- http://api.jquery.com/live/ [DEPRECATED]- Javascript functions on MDN - https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Functions
Answered By - Chris Baker Answer Checked By - Katrina (PHPFixing Volunteer)
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.