I have a page with multiple Updatepannel that are all visible false and I show them one after another when you click a button.
I want to use bootstrap datetime picker but my problem is that the script is not rune by the browser.
<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker();
});
</script>
If I run this in the console all is working.
Any ideas on how to force the run of the script ?
As requested :
$(function () {
$('#datetimepicker1').datetimepicker();
});
init[1]0: documentcontext: documentURL: "http://localhost:52261/Dashboard.aspx"activeElement: bodyalinkColor: ""all: HTMLAllCollection[520]anchors: HTMLCollection[0]applets: HTMLCollection[0]baseURI: "http://localhost:52261/Dashboard.aspx"bgColor: ""body: bodycharacterSet: "UTF-8"charset: "UTF-8"childElementCount: 1childNodes: NodeList[2]children: HTMLCollection[1]compatMode: "CSS1Compat"contentType: "text/html"cookie: ""cphNavigation_imgProfile: undefinedcurrentScript: nulldefaultView: WindowdesignMode: "off"dir: ""doctype: <!DOCTYPE html>documentElement: htmldocumentURI: "http://localhost:52261/Dashboard.aspx"domain: "localhost"embeds: HTMLCollection[0]fgColor: ""firstChild: <!DOCTYPE html>firstElementChild: htmlfonts: FontFaceSetforms: HTMLCollection[1]head: headhidden: falseimages: HTMLCollection[1]implementation: DOMImplementationinputEncoding: "UTF-8"isConnected: truejQuery19107336506808681962: 1lastChild: htmllastElementChild: htmllastModified: "02/17/2017 11:51:13"linkColor: ""links: HTMLCollection[68]location: LocationnextSibling: nullnodeName: "#document"nodeType: 9nodeValue: nullonabort: nullonauxclick: nullonbeforecopy: nullonbeforecut: nullonbeforepaste: nullonblur: nulloncancel: nulloncanplay: nulloncanplaythrough: nullonchange: nullonclick: nullonclose: nulloncontextmenu: nulloncopy: nulloncuechange: nulloncut: nullondblclick: nullondrag: nullondragend: nullondragenter: nullondragleave: nullondragover: nullondragstart: nullondrop: nullondurationchange: nullonemptied: nullonended: nullonerror: nullonfocus: nulloninput: nulloninvalid: nullonkeydown: nullonkeypress: nullonkeyup: nullonload: nullonloadeddata: nullonloadedmetadata: nullonloadstart: nullonmousedown: nullonmouseenter: nullonmouseleave: nullonmousemove: nullonmouseout: nullonmouseover: nullonmouseup: nullonmousewheel: nullonpaste: nullonpause: nullonplay: nullonplaying: nullonpointercancel: nullonpointerdown: nullonpointerenter: nullonpointerleave: nullonpointerlockchange: nullonpointerlockerror: nullonpointermove: nullonpointerout: nullonpointerover: nullonpointerup: nullonprogress: nullonratechange: nullonreadystatechange: nullonreset: nullonresize: nullonscroll: nullonsearch: nullonseeked: nullonseeking: nullonselect: nullonselectionchange: nullonselectstart: nullonshow: nullonstalled: nullonsubmit: nullonsuspend: nullontimeupdate: nullontoggle: nullonvolumechange: nullonwaiting: nullonwebkitfullscreenchange: nullonwebkitfullscreenerror: nullonwheel: nullorigin: "http://localhost:52261"ownerDocument: nullparentElement: nullparentNode: nullplugins: HTMLCollection[0]pointerLockElement: nullpreferredStylesheetSet: nullpreviousSibling: nullreadyState: "complete"referrer: "http://localhost:52261/Default.aspx"rootElement: nullscripts: HTMLCollection[18]scrollingElement: bodyselectedStylesheetSet: nullstyleSheets: StyleSheetListtextContent: nulltitle: "Credit Hire Portal"visibilityState: "visible"vlinkColor: ""webkitCurrentFullScreenElement: nullwebkitFullscreenElement: nullwebkitFullscreenEnabled: truewebkitHidden: falsewebkitIsFullScreen: falsewebkitVisibilityState: "visible"xmlEncoding: nullxmlStandalone: falsexmlVersion: null__proto__: HTMLDocumentlength: 1__proto__: Object[0]
Update 1
In the master page I have 2 contentplaceholders, one for navigation bar and the second for a multi step form (in here i have the datetimepicker).
If I put the datetimepicker on the navigation content all is working ... :(
You need to insure that your script under the all the declaration of all the .js(Library files).
Ex.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.45/js/bootstrap-datetimepicker.min.js"></script>
<script src="Link of other.js"></script>
<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker();
});
</script>
also you can see the error of script in console window of your browser.
ex. in chrome browser press F12. and click on console. it will display the error of your script.
Related
I get the testFile.js filename from url parameters, so it is loaded dynamically.
Then i do:
<script>jQuery.getScript('testFolder/testFile.js');</script>
<script src="ok1.js" type="text/javascript" charset="UTF-8"> </script>
<script src="ok2.js" type="text/javascript" charset="UTF-8"> </script>
testFile.js has:
function getFile0(){}
ok1.js has:
function getFile1(){}
function getFile2(){}
function getFile3(){}
ok2.js has:
var _getFiles = [getFile0(), getFile1(), getFile2(), getFile2()];
Although, it is supposed to load first the testFile.js, then ok1.js and finally ok2.js, i get this error for ok2.js: Uncaught ReferenceError: getFile0 is not defined
I have tried plenty of stuff like:
jQuery.getScript('testFolder/testFile.js').done(function() {
jQuery.getScript('ok1.js').done(function() {
jQuery.getScript('ok2.js');
});
});
it is loading without error, but the page is not working as it should.
I want to validate mobile number worldwide,so i have search a lot and finally get intl-tel-input library to perform this task easily.
i m using this from GitHub, all thing work fine.
Problem is that i m not getting auto Country Code based on user ip address in my project but when i use it individually it works.
i m sharing all thing that i have done.
i m working on
-MVC Asp
Here is the screenshot that i actually want.
https://imgur.com/TWjdrVH
Here is the screenshot that i got yet
https://imgur.com/Yr7MYBx
Error i got
Firefox
The script from “https://ipinfo.io/?callback=jQuery112405092049163202047_1555700688067&_=1555700688068” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.[Learn More] Register
Loading failed for the with source “https://ipinfo.io/?callback=jQuery112405092049163202047_1555700688067&_=1555700688068”. Register:1:1
https://imgur.com/Q98ypO7
Chrome
GET https://ipinfo.io/?callback=jQuery112403105878441128118_1555701843619&_=1555701843620 net::ERR_ABORTED 429
https://imgur.com/whH2rVr
Here is some code that i used
View
#Html.EditorFor(model => model.user_mobile, new { htmlAttributes = new { #class = "form-control", id = "mobile" } })
Scripts
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="~/js/bootstrap.min.js"></script>
<!-- Multi select -->
<script src="~/js/multi_select.js"></script>
<!-- Select 2-->
<script src="~/js/select2/select2.full.min.js"></script>
<!-- Custom JS File -->
<script src="~/js/custom.js"></script>
<script src="~/Scripts/validation/phone/intlTelInput.js"></script>
<script type="text/javascript">
var input = document.querySelector("#mobile");
window.intlTelInput(input, {
initialCountry: "auto",
geoIpLookup: function (callback) {
$.get('https://ipinfo.io', function () { }, "jsonp").always(function (resp) {
var countryCode = (resp && resp.country) ? resp.country : "";
callback(countryCode);
});
},
//utilsScript: "build/js/utils.js" // just for formatting/placeholders etc
});
$(function () {
$('.multiselect-ui').multiselect({
includeSelectAllOption: true
});
});
// Select 2 searchable
$(function () {
//Initialize Select2 Elements
$('.select2').select2()
});
</script>
Help me out to solve my problem
i want to get auto country code based on user ip address
You need to replace url with token:
be like: https://ipinfo.io -> https://ipinfo.io?token=$Your_token
You need to register at https://ipinfo.io/ at get your token.
I have a bunch of web pages where I have an identical construct:
<html>
<head>
<script src="sorttable.js"></script>
<noscript>
<meta http-equiv="refresh" content="60">
</noscript>
<script type="text/javascript">
<!--
var sURL = unescape(window.location.pathname);
function doLoad()
{
setTimeout( "parent.frames['header_frame'].document.submitform.submit()", 60*1000 );
}
function refresh()
{
window.location.href = sURL;
}
//-->
</script>
<script type="text/javascript">
<!--
function refresh()
{
window.location.replace( sURL );
}
//-->
</script>
<script type="text/javascript">
<!--
function refresh()
{
window.location.reload( true );
}
//-->
</script>
</head>
<body>
.
.
.
<script type="text/javascript">
window.onload = function() { sorttable.innerSortFunction.apply(document.getElementById("OpenFace-2"), []); doLoad(); }
</script>
</body>
</html>
This works perfectly in every page except for one, where when the onload function runs it cannot find the sorttable code (which is loaded from sorttable.js up at the top). All these pages are part of the same application and are all in the same dir along with the js file. I do no get any errors in the apache log or the js console until that page loads, when I get:
sorttable.innerSortFunction is undefined
I can't see what makes this one page different. Can anyone see what is wrong here, or give me some pointers on how I can debug this further?
The code I pasted in is from the source of the page where it does not work, but it is identical as the pages where it does work.
Looks like on that page the table with id OpenPhace-2 by which you try to sort have no needed class: sortable
The function innerSortFunction of sorttable object will be present only if there is any table with sortable class exists.
According to inmobi Developer Wiki
http://developer.inmobi.com/wiki/index.php?title=JavaScript
You can call the Ads on Demand using manual: true parameter in the Var section:
E.g:
<script type="text/javascript" src="http://cf.cdn.inmobi.com/ad/inmobi.js">
</script>
<script type="text/javascript">
var inmobi_conf = {
siteid : "your site id",
slot : "slot number",
test: true,
manual: true
};
</script>
<div id="adArea"> </div>
To generate the Ad you have to call it using:
_inmobi.getNewAd(document.getElementById('adArea'));
it should populate the Ad.
I´ve created a simple test example to request an Ad on demand (using test siteid provided by inmobi).
The problem is that I have to click twice to load the Ad
Full Source:
<html>
<head>
<script>
var inmobi_conf = {
siteid : "4028cba631d63df10131e1d3191d00cb",
slot : "15",
test: true,
manual: true
};
function loadAdd(){
_inmobi.getNewAd(document.getElementById('screen'));
};
</script>
<script src="http://cf.cdn.inmobi.com/ad/inmobi.js"></script>
</head>
<body>
<div id="screen"> </div>
<button id="btn1" onClick="loadAdd()">Load Ad</button>
</body>
</html>
You can try it out on http://jsfiddle.net/YYzqA/
1st click on "Load Ad" button (no Ad)
2nd click on "Load Ab" button (the Ad will be loaded)
By chance do you know the reasons for this behavior? am I missing something?
You have set manual: true
you need to set it to manual: false for it to automatically set the configuration for you.
When you set manual: true, your first click is loading the configurations
Checkout the fiddle
As you all know that we cannot access custom labels (I might be wrong here) in sidebar component, like we do in vf pages({!$label.labelname}), I had to write a webService class in apex which will return the custom label and I use the sforce.apex.execute to access that class in jQuery script. Now, when the home page is loaded, the sidebar components load correctly and the below script executes without any problem. But when I enter some text in the textbox and search the text, myVfPage loads in a new tab with expected result, but again when I enter some text in the sidebar component and click on search I am not redirected to myVfPage. When I check the console in see 2 error which says:. This is what the error messages read:
1:- Failed to load resource: the server responded with a status of 500 (Internal Server Error)
2:-Uncaught {faultcode:'sf:INVALID_SESSION_ID', faultstring:'INVALID_SESSION_ID: Invalid Session ID found in SessionHeader: Illegal Session', }
Not sure what to do here kindly help
<script type="text/javascript" src="/resource/jQuery"></script>
<script type="text/javascript" src="/resource/connection"></script>
<script type="text/javascript" src="/resource/apexjs" ></script>
<script type="text/javascript">
var j$ = jQuery.noConflict();
var sid = getCookie('sid');
var server = "https://"+window.location.host+"/services/Soap/u/26.0";
alert(server);
sforce.connection.init(sid, server);
var custLabelSearchText = sforce.apex.execute("JqueryCustomLabelController","getCustomLabel", {});
j$(document).ready(function(){
alert(getCookie('sid'));
j$("#searchIt").bind('click', function(){
if(j$("#userInput").val() == ''){
alert(custLabelSearchText);
custLabelSearchText ='';
}else{
window.open("/apex/myVfPage?searchText="+(j$("#userInput").val()), "_blank");
}
});
});
</script>
<b>Search your Text here</b><br/>
<input id="userInput" type="text"/><br/>
<input type="button" value="Search" id="searchIt"/>
I'm not sure, but try to insert session ID in the page header:
<script type="text/javascript">
var __sfdcSessionId = '{!GETSESSIONID()}';
</script>