i have sevrale pages that have multiple jquery datatable and i just want to auto click alert when alert have this message : 'DataTables warning: table id='. i have set this javascript for auto click if this message comes.
code :
<script type="text/javascript">
debugger;
var htmlString = new XMLSerializer().serializeToString(document)
var indexOfAlertBeginning = "";
var indexOfAlertEnd = "";
var stringFromAlert = "";
var alertMessages = "";
if (htmlString.includes('alert(')) {
indexOfAlertBeginning = htmlstring.indexof('alert(');
stringFromAlert = htmlstring.substr(indexOfAlertBeginning);
indexOfAlertEnd = stringFromAlert.indexof(')');
alertMessages = stringFromAlert(0, indexOfAlertEnd);
}
if (stringFromAlert.includes('DataTables warning: table id=', 0)) {
window.alert = function () {
return true;
}
}
</script>
but this have no effect and alert message comes up every time. whats' wrong here please help me...
If you are loading data to the table using ajax most of the time cause the problem unmatched column name between json data and columnname in your script.
I found this post pretty useful for datatable and .Net Jquery Datatable with .Net
Related
For a university project, I'm displaying jobs in Leeds using mainly JavaScript and JSON. The idea is that the JSON part-time file is shown on page load, then a user can select a different job category and then it loads the new JSON file and replaces the HTML.
I believe my code is almost there, I've attempted to figure out how to call a function again as my previous code had lots of repetition. However, instead of replacing the innerHTML when an option is selected, it just adds the new content to the bottom of the previous option's HTML. I can't figure out why this is?
I've attempted to clear the ID before the function starts again but this doesn't work. Perhaps I'm not calling my functions correctly?
Any help would be greatly appreciated!
window.onload = function() {
var jobURL = "";
//Run function
loadJobs();
//If dropdown is changed
function change(){
var jobType = document.getElementById("jobtype");
var selectedValue = jobType.options[jobType.selectedIndex].value;
if (selectedValue == "part") {
var jobURL = "https://example.com/reed_parttime.php";
}
if (selectedValue == "temp") {
var jobURL = "https://example.com/reed_temp.php";
}
if (selectedValue == "graduate") {
var jobURL = "https://example.com/reed_graduate.php";
}
return jobURL;
}
document.getElementById("jobtype").onchange = change;
//Show jobs function
function loadJobs() {
document.getElementById("results").innerHTML = "";
var URL = change();
$.getJSON(URL, function(data) {
data.results.forEach(function(jobinfo) {
HTMLTemplate += `
<div class="row">
<a href="${jobinfo.jobUrl}" target="_blank">
<p>${jobinfo.jobTitle}</p>
<p>${jobinfo.employerName}</p>
<p>${jobinfo.jobDescription}</p>
</a>
</div>
`;
});
document.getElementById("results").innerHTML = HTMLTemplate;
});
}
//Repeat function again when button is clicked
document.getElementById("submitBtn").addEventListener("click", loadJobs);
}
I have this certain problem where I cannot get the number value of 'currentStock' var data inside an HTML file using JavaScript. I have this on my HTML file in script tag:
By the way, due to the HTML being too large, and also it was not originally my script, but from a friend who was asking for some help on adding some features in it, I can't upload the whole script as it will be going to be too long. The whole HTML script has 14076 characters with 289 lines.
I have only studied java and not javascript with HTML, so I need help with this one.
<script>
window.onload = function() {
var goDown = document.getElementById('uniqueNav');
var goRight = document.querySelector('.clothesNav');
var goUp = document.querySelector('.shrink');
goDown.style.marginTop = "0px";
goRight.style.marginLeft = "5px";
goUp.style.height = "0px";
}
$('document').ready(function(){
var name = "Ombre Printed Shirt";
var price = "P499.00";
var initialStock = 0;
var currentStock = initialStock;
document.querySelector('#clothTitle').innerHTML = "" +name;
document.querySelector('#clothPrice').innerHTML = "Price: " +price;
document.querySelector('#PITitle').innerHTML = "" +name;
document.querySelector('#PIPrice').innerHTML = "Price: " +price;
document.querySelector('#currentStock').innerHTML = "CurrentStocks: " +currentStock;
}); //------------------------Change This Every Document ----------------------------//
</script>
then this in my JavaScript File:
var cStocks = document.getElementById('currentStock').data;
alert(typeof cStocks);
alert("Data in cStocks = " + cStocks);
if (!cStocks) {cStocks = 0; alert("cStocks, not a valid number");}
if ((cStocks <= 0) == true)
{
document.querySelector('.clothButton').style.display='none';
document.querySelector('.clothButtonDisabled').style.display='flex';
}
else
{
document.querySelector('.clothButton').style.display='flex';
document.querySelector('.clothButtonDisabled').style.display='none';
}
upon loading the page, the alert says thaat the data type is undefined. I don't know what's happening with my code. did I miss something?
By the way, I have JQuery on my HTML page. it says JQuery v3.3.1 as a version
It doesn't look to me like #currentStock will have a data attribute, or value attribute (which is for inputs), so of course the js returns undefined. Right now it looks like #currentStock is having the innerHTML set on the document.ready to Current Stocks: 0
You do have an accessible variable, currentStock, which is defined during document.ready. Why aren't you accessing it directly? It will have the numeric value in it already. All you can get from #currentStock is the html you generated on document.ready, and you'd have to parse the number out of it, when it's available in raw form in the js variable currentStock.
Why does this error happen when it try to use jquery? This code was working before but I don't even know what did I do for this error to happen. I tried to search about it and nothing I looked up makes sense or it's about this jsdom or whatever that I don't use. Exception is thrown on the 1st line in the try catch. That's the only error I could get from the browser debugger:
function DisplayName() {
if (Page_ClientValidate()) {
try {
$get("lblNameShow").html = $get("<%= txtNome.ClientID %>").value;
$get("lblDataAdmissaoShow").innerHTML = document.getElementById("datepicker").value;
var ddlD = document.getElementById("<%= ddlDepartamento.ClientID%>");
var strDDLDepart = ddlD.options[ddlD.selectedIndex].text;
$get("lblDepartamentoShow").innerHTML = strDDLDepart;
var ddlF = document.getElementById("<%= ddlFuncao.ClientID%>");
var strDDLFunc = ddlF.options[ddlF.selectedIndex].text;
$get("lblFuncaoShow").innerHTML = strDDLFunc;
//get valor radio button
var rstTel = $('#<%=rblTelemovel.ClientID %> input[type=radio]:checked').val();
if (rstTel == 0)
$get("lblTelemovelShow").innerHTML = "Não"
else
$get("lblTelemovelShow").innerHTML = "Sim"
var message = "";
var checkBoxList = document.getElementById("<%=cblAppAlternativas.ClientID%>");
var checkBoxes = checkBoxList.getElementsByTagName("INPUT");
for (var i = 0; i < checkBoxes.length; i++) {
if (checkBoxes[i].checked) {
var value = checkBoxes[i].value;
var text = checkBoxes[i].parentNode.getElementsByTagName("LABEL")[0].innerHTML;
message += value + "-" + text + ",";
}
}
//alert(message);
$get("lblAcessoShow").innerHTML = message;
$get("lblObShow").innerHTML = $get("<%= txtObservacoes.ClientID %>").value;
} catch (err) {
$get("demo").innerHTML = err.message;
}
$('#NewColabModal').modal('show')
}
return false;
}
EDIT
The code works if I remove the get from the jquery selector, but the strange thing is the code was working before. I can't find any info about using $get in jquery to select elements so I'm not sure about it if it's a plugin. This code was already implemented in the project I'm working on so I have no idea which plugin uses $get.
on the original project these are the only references on it
<link rel="stylesheet" type="text/css" href="jquery-ui-1.12.1.custom/jquery-ui.css" />
<script src="jquery-ui-1.12.1.custom/external/jquery/jquery.js"></script>
<script src="jquery-ui-1.12.1.custom/jquery-ui.js"></script>
<script type="text/javascript" src="NOTY/js/noty/packaged/jquery.noty.packaged.js"></script>
EDIT 2
So I was using a try catch to catch the error but I was doing it in the wrong way since I'm still new to javascript. The exception I got is that $get is not defined. So rather than asking where $get comes from, how do I define a variable in jquery like $get?
I am trying to have a button on a SharePoint form query the govt SAM web service. Basically, I want to be able to manually enter a value in the form, click an HTML button, to query that value from the open form, and then fill out the rest of the fields automatically and save the record in a SP list. I am just working on the query portion now. I have jquery embedded in my master page.
When I wrote all the logic in the browser console, everything works fine. I cannot get it to mesh up with the button. I get this error in the console.
"Uncaught SyntaxError: Unexpected token <" which makes no sense. Here is my script:
<script>
$("button").click(function () {
var SAM_Title = document.getElementById('Title_fa564e0f-0c70-4ab9-b863-
0177e6ddd247_$TextField').value;
var URL = "https://api.data.gov/sam/v1/registrations/" + SAM_Title +
"0000?api_key=xxxxxxxxxxxxxxxxxxxxxxx";
var SAM_AJAX = $.get(URL);
var SAM_JSON = SAM_AJAX.responseText;
var parsedJSON = JSON.parse(SAM_JSON);
var BusinessName = parse.sam_data.registration.legalBusinessname;
var StreetAddress =
parsedJSON.sam_data.registration.govtBusinessPoc.address.Line1;
var City = parsedJSON.sam_data.registration.govtBusinessPoc.address.City;
var ZIP = parsedJSON.sam_data.registration.govtBusinessPoc.address.ZIP;
}
</script>
Here is what I am putting in my script editor web part:
<html>
<script src="/SiteAssets/SAM_Query.js">
</script>
<body>
<button>Get External Content</button>
</body>
</html>
where SAM_Query.js is the above mentioned script.
I got it to work. The key was line 13 and cleaning up the syntax.
jQuery.noConflict();
jQuery( document ).ready(function() {
console.log( "jquery ready!" );
})
function samWebService() {
SAM_Title = document.getElementById('Title_fa564e0f-0c70-4ab9-b863-0177e6ddd247_$TextField').value;
console.log("DUNS: " + SAM_Title);
URL = "https://api.data.gov/sam/v1/registrations/" + SAM_Title + "0000?api_key=xxxxxxxxx";
console.log("URL: " + URL);
jQuery.ajaxSetup({ async: false });
SAM_AJAX = jQuery.get(URL);
console.log("SAM JSON response: " + SAM_AJAX);
SAM_JSON = SAM_AJAX.responseText;
console.log(SAM_JSON);
parsedJSON = JSON.parse(SAM_JSON);
console.log(parsedJSON);
BusinessName = parsedJSON.sam_data.registration.legalBusinessName;
StreetAddress = parsedJSON.sam_data.registration.mailingAddress.Line1;
City = parsedJSON.sam_data.registration.mailingAddress.City;
ZIP = parsedJSON.sam_data.registration.mailingAddress.Zip;
document.getElementById('Address_bc611d08-c16c-4ad9-a5b8-14388e176aba_$TextField').value=StreetAddress
document.getElementById('City_dd99bc74-382f-406c-aec0-8dc196b2c8ef_$TextField').value = City
document.getElementById('Business_x0020_Name_5eb60d17-9d0b-4243-92f5-81f5534e8bc0_$TextField').value = BusinessName
document.getElementById('ZIP_e078f52b-a0bc-4c95-a622-a16d6491b017_$TextField').value = ZIP
};
And calling the function with a clickable link.
<script src="/siteassets/lib/jquery/jquery.min.js"></script>
<script src="/test/SiteAssets/SAM_Query.js"></script>
Click Me!
I have been accessing the rows of Gridview quite easily using javascript.
But when I try to add a new row and then try to access, then the code is not working.
Is there a way by which I can access the footer row text box?
Below is my code which works well when edit mode text boxes are to be accessed. Please donot post any link.
function OnSelectIndexChange() {
var drpdwn = document.getElementById("ddlSelectUnderwriterCond");
var drpdwnValue = drpdwn.options[drpdwn.selectedIndex].text;
var gridview = document.getElementById("<%= StandardUndewritingGrid.ClientID %>");
for (var i = 1; i <= gridview.rows.length; i++) {
var labels = gridview.rows[i].cells[0].getElementsByTagName("input")[0].value;
var txtbx = gridview.rows[i].cells[0].children[0];
if (drpdwnValue != '-- Select --')
txtbx.value = labels + '<^>' + drpdwnValue + '<^>';
}
}
I have just figured out a way of accessing the footer row and code is working fine so I am posting as it might help someone as well:
var flabels = document.getElementById('<%=((TextBox)gridname.FooterRow.FindControl("controlname")).ClientID %>');
if (flabels != null) {
}
It works by simple logic:
var grid = document.getElementById('<%= GridviewName.ClientID %>');
var FooterTextBoxName = grid.getElementsbyTagName('FooterTextBoxName');