javascript - Function to pass html into bootstrap modal using ajax and jquery .load() -
i have list of elements have different ids @ moment using these specific ids call identical functions shows modal , loads html html file based on id of button clicked using ajax , jquery. works fine except have repeat same function again , again changing id of button clicked , id of html loaded. want find way use same function every button. below how have repeat fucntion different buttons:
$("#theconjuringpreview").click(function(){ $("#mymodal").show(); $("#mymodal").on('shown.bs.modal', function () { $("#preview-content").load("ajax.html #theconjuring"); }); }); /*different button clicked*/ $("#sinisterpreview").click(function(){ $("#mymodal").show(); $("#mymodal").on('shown.bs.modal', function () { $("#preview-content").load("ajax.html #sinister"); }); });
i thinking work: putting showmodal() function onclick attribute , giving parameter of address of html loaded use different address different content still use same fucntion. html of button , html loaded in below along showmodal() function.
<td><a href="#" onclick="showmodal('ajax.html #sinister')" data-remote="false" data-toggle="modal" data-target="#mymodal">watch preview</a></td> function showmodal(idofhtml){ $("#mymodal").show() var id = idofhtml; $("#mymodal").on('shown.bs.modal', function () { $("#preview-content").load(id); }); }
ajax.html #sinister supposed loaded modal in case, doesn't.
if has suggestions how appreciate input. thanks.
Comments
Post a Comment