|
The PHP page will access the SQL server database, read values, crunch the numbers, and write values.
The PHP page also updates HTML in a value container on the presentation layer. Not sure how I'm going to handle that.
The purpose is to let the user know that work is being done; obvious, but the old method was to open a browser window with a progress spinner and close it using this copied from the internet back in 2005.
I get what it does, but it seems over complicated to me.
(function() {
window.spawn = window.spawn || function(gen) {
function continuer(verb, arg) {
let result;
try {
result = generator[verb](arg);
}
catch (err) {
return Promise.reject(err);
}
if (result.done) {
return result.value;
} else {
return Promise.resolve(result.value).then(onFulfilled, onRejected);
}
}
let generator = gen();
let onFulfilled = continuer.bind(continuer, 'next');
let onRejected = continuer.bind(continuer, 'throw');
return onFulfilled();
};
window.showModalDialog = window.showModalDialog || function(url, arg, opt) {
url = url || '';
arg = arg || null;
opt = opt || 'dialogWidth:300px;dialogHeight:300px';
let caller = showModalDialog.caller.toString();
let dialog = document.body.appendChild(document.createElement('dialog'));
dialog.setAttribute('style', opt.replace(/dialog/gi, ''));
dialog.innerHTML = '<input class="btn-primary" type="button" id="dialog-close" value="Continue" style="position: absolute; top: 2px; right: 4px; font-size: 20px; color: #000; text-decoration: none; outline: none;"><iframe id="dialog-body" src="' + url + '" style="border: 0; width: 100%; height: 100%;"></iframe>';
document.getElementById('dialog-body').contentWindow.dialogArguments = arg;
document.getElementById('dialog-close').addEventListener('click', function(e) {
e.preventDefault();
dialog.close();
});
if (caller.indexOf('yield') >= 0) {
return new Promise(function(resolve, reject) {
dialog.addEventListener('close', function() {
var returnValue = document.getElementById('dialog-body').contentWindow.returnValue;
document.body.removeChild(dialog);
resolve(returnValue);
});
});
}
var isNext = false;
var nextStmts = caller.split('\n').filter(function(stmt) {
if (isNext || stmt.indexOf('showModalDialog(') >= 0)
return isNext = true;
return false;
});
dialog.addEventListener('close', function() {
var returnValue = document.getElementById('dialog-body').contentWindow.returnValue;
document.body.removeChild(dialog);
nextStmts[0] = nextStmts[0].replace(/(window\.)?showModalDialog\(.*\)/g, JSON.stringify(returnValue));
eval('{\n' + nextStmts.join('\n'));
});
};
})();
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
Hmm, that's not remotely what your page is doing, though. The code you have shown us is running in the browser, and makes a remote call to the d/b. That's totally different from "running a php page". If you want to do that, just enable the php page, then submit the form. When the server side code is complete and the response returned to the browser, the page will replace what was previously shown and the spinner will be gone. Or, just make an AJAX callback to your php page.
|
|
|
|
|
Ok
Thanks for verifying that, I'm way off course here. I'll do the AJAX call first and see how that works out.
I'll be back. 
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
Well this works, the page takes about 10 secs to run and the spinner turns off. I'm trying to return some JSON back from the PHP page, as an option in case I need to use the option. I should probably post this in the other forum. Anyways, this is my JavaScript.
.then(function(data) is undefined, scratching my head on this. Maybe it's another keyword.
This is what I get back from .then(status = {, which actually looks good. The status below returns when the PHP page is done running. When I think about it, this must be the response header sent when done. So my JSON output should be in this payload within the body I think.
HTTP Status:<br /><br />
Response<br />
body: ReadableStream { locked: false }<br />
bodyUsed: false<br />
headers: Headers { }<br />
ok: true<br />
redirected: false<br />
status: 200<br />
statusText: "OK"<br />
type: "basic"<br />
url: "<a href="http:
<prototype>: ResponsePrototype { clone: clone(), arrayBuffer: arrayBuffer(), blob: blob(), … }<br />
msrpAsync.js:42:25
My JavaScript
spinner.classList.remove('hide');
spinner.classList.add('show');
const saveUrl = 'msrpControllerTest.phtml?save=1&cachebuster=' + (new Date()).valueOf();
fetch(saveUrl, { mode: 'same-origin', headers: { "Content-Type": "application/json; charset=utf-8" }})
.then(status => {
console.log("HTTP Status: ", status);
})
.then(function(data) {
console.log("Request succeeded with JSON response: ", JSON.stringify(data));
spinner.classList.remove('show');
spinner.classList.add('hide');
})
.catch(err => {
spinner.classList.remove('show');
spinner.classList.add('hide');
console.log("Ajax error - ", err);
alert("An error has occurred, and no error code has been written yet to debug the error")
});
I wrote this as a PHP 4.3 test page. I don't think that json_encode() will work since it's PHP 4.3.
Remember that I haven't worked with PHP 4 since 2003, so it's been 17 years.
ob_start();
header('Content-Type: application/json');
$jsonResult = "
{
\'status\': \'202\',
\'message\': \'No Project Number assigned\',
\'msrp\': {
\'bookPrice\': 0.00,
\'finalAdd\': 0.00
}
}";
echo $jsonResult;
ob_end_flush();
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
I can only have 1 then in the fetch, with catch.
On Postman, my JSON is there in the body from the PHP page.
I'll figure it out eventually. But be my Fetch.
spinner.classList.remove('hide');
spinner.classList.add('show');
const saveUrl = 'msrp-api-async.phtml?save=1&cachebuster=' + (new Date()).valueOf();
fetch(saveUrl, { mode: 'same-origin', headers: { "Content-Type": "application/json; charset=utf-8" }})
.then(response => {
console.log("response: ", response);
console.log("Request succeeded with JSON response: ", JSON.stringify(response.json));
spinner.classList.remove('show');
spinner.classList.add('hide');
})
.catch(err => {
spinner.classList.remove('show');
spinner.classList.add('hide');
console.log("Ajax error - ", err);
alert("An error has occurred, and no error code has been written yet to debug the error")
});
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
Then must be like a pipe in Angular or rxjs. And it required more piping. I think think the internet is loaded with bad or old examples of how to use fetch.
Using Fetch - Web APIs | MDN
spinner.classList.remove('hide');
spinner.classList.add('show');
const saveUrl = 'msrp-api-test.phtml?save=1&cachebuster=' + (new Date()).valueOf();
fetch(saveUrl, { mode: 'same-origin', method: 'POST', headers: { "Content-Type": "application/json; charset=utf-8" }})
.then(response => response.json())
.then(data => {
console.log("Success: ", data);
spinner.classList.remove('show');
spinner.classList.add('hide');
})
.catch(err => {
spinner.classList.remove('show');
spinner.classList.add('hide');
console.log("Ajax error - ", err);
alert("An error has occurred, and no error code has been written yet to debug the error")
});
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
Hi we have a beautiful feature in Visual Studio that takes us from the place of its usage to definition if we right click and say go to definition or implementation.
Can we do the same for JavaScript frameworks, is there any way to do it? For example I have a component usage as below:
{{#link-to 'dashboard' tagName='li'}}
, in EmberJS, can I go to the definition of this component?.
Thank you so much
|
|
|
|
|
What happens when you try it?
|
|
|
|
|
|
Well there is your answer.
|
|
|
|
|
I have a datepicker which needs to have its date disabled only on button click. below is the code on button click. I actually wanted to use returned data but for now to check I am only using availableDates for blocking.
Please help.
posting.done(function (data) {
var date = new Date();
var temp = data.split(",");
alert(data);
var year = (new Date).getFullYear();
$("#datepicker").datepicker();
var availableDates = ['01-25-2021'];
$("#datepicker").datepicker({
beforeShowDay: function (d) {
var dmy = (d.getMonth() + 1);
if (d.getMonth() < 9)
dmy = "0" + dmy;
dmy += "-";
if (d.getDate() < 10) dmy += "0";
dmy += d.getDate() + "-" + d.getFullYear();
if ($.inArray(dmy, availableDates) != -1) {
return [false];
} else {
return [true];
}
}
});
})
Dhyanga
|
|
|
|
|
Could somebody help me, please?
With if-else condition works fine, but with these always the first block runs. I don't understand why.
let positiveNumber = -1;
positiveNumber > 0;
positiveNumber ? console.log('positive') : console.log('not positive');
|
|
|
|
|
You need to do the following for an if-else equivalent of what you are trying:
let positiveNumber = -1;
positiveNumber > 0 ? console.log('positive') : console.log('not positive');
This should give you back "not positive"
|
|
|
|
|
You are very kind and quick, thank you!
|
|
|
|
|
I have a js fn embedded in an aspx file. I reference a global code behind variable in the script. Works great. I moved the script to a .js file in the same project. OnClientcClick I find the script just fine but the variable is not available. Is it possible to reference or pass by value a variable to an external .js script?
|
|
|
|
|
It's not possible period. What was happening was the compiler was inserting your value into the js file during compile time or execution time.
Javascript executes on the client side and c# on the server. They are completely separate.
But no, I don't think you can do what you did before in a separate js file. And even if you can, my personal opinion is to never do it.
|
|
|
|
|
Thanks for the quick replay. I did do a goggle search half of the hits said you can the other half said no way. I did try a few examples but nothing worked. I don't do much in js but am curious as to why it would be a bad idea if it did work.
|
|
|
|
|
Member 14924607 wrote: why it would be a bad idea if it did work.
Because Javascript executes on the client side and C# executes on the server side. The 2 have no relationship to each other. They should not be mixed.
jQuery.ajax() is a very common way to get values from the server that are needed client side.
|
|
|
|
|
|
Hello, I made my first javascript game and I'm hopping to get some help here to fix some problems in the program please.
This is my code: https://codepen.io/mandyq/project/editor/XYndRv
When I load the page, the DrawGameScreen function is not executing and I have to refresh the page once so the DrawGameScreen function to execute. Much appreciated for some help please.
Queenie
|
|
|
|
|
If you want help with some code then you need to show it as part of your question. People here are not going to go to some other website and try to analyse what you have done. Please edit your question and add the details there.
|
|
|
|
|
Thank you for your reply.
My code is a bit too long and I don't know which code snippet to include in here.
Can I close this message? I found the answer from somewhere else.
|
|
|
|
|
Hi, I need help turning this client side script code into pseudocode
var slideIndex,slides,dots,captionText;
function initGallery(){
slideIndex = 0;
slides=document.getElementsByClassName("imageHolder");
slides[slideIndex].style.opacity=1;
captionText=document.querySelector(".captionTextHolder .captionText");
captionText.innerText=slides[slideIndex].querySelector(".captionText").innerText;
if(slides.length<2){
var nextPrevBtns=document.querySelector(".leftArrow,.rightArrow");
nextPrevBtns.style.display="none";
for (i = 0; i < nextPrevBtn.length; i++) {
nextPrevBtn[i].style.display="none";
}
}
dots=[];
var dotsContainer=document.getElementById("dotsContainer"),i;
for (i = 0; i < slides.length; i++) {
var dot=document.createElement("span");
dot.classList.add("dots");
dotsContainer.append(dot);
dot.setAttribute("onclick","moveSlide("+i+")");
dots.push(dot);
}
dots[slideIndex].classList.add("active");
}
initGallery();
function plusSlides(n) {
moveSlide(slideIndex+n);
}
function moveSlide(n){
var i;
var current,next;
var moveSlideAnimClass={
forCurrent:"",
forNext:""
};
var slideTextAnimClass;
if(n>slideIndex) {
if(n >= slides.length){n=0;}
moveSlideAnimClass.forCurrent="moveLeftCurrentSlide";
moveSlideAnimClass.forNext="moveLeftNextSlide";
slideTextAnimClass="slideTextFromTop";
}else if(n<slideIndex){
if(n<0){n=slides.length-1;}
moveSlideAnimClass.forCurrent="moveRightCurrentSlide";
moveSlideAnimClass.forNext="moveRightPrevSlide";
slideTextAnimClass="slideTextFromBottom";
}
if(n!=slideIndex){
next = slides[n];
current=slides[slideIndex];
for (i = 0; i < slides.length; i++) {
slides[i].className = "imageHolder";
slides[i].style.opacity=0;
dots[i].classList.remove("active");
}
current.classList.add(moveSlideAnimClass.forCurrent);
next.classList.add(moveSlideAnimClass.forNext);
dots[n].classList.add("active");
slideIndex=n;
captionText.style.display="none";
captionText.className="captionText "+slideTextAnimClass;
captionText.innerText=slides[n].querySelector(".captionText").innerText;
captionText.style.display="block";
}
}
var timer=null;
function setTimer(){
timer=setInterval(function () {
plusSlides(1) ;
},3000);
}
setTimer();
function playPauseSlides() {
var playPauseBtn=document.getElementById("playPause");
if(timer==null){
setTimer();
playPauseBtn.style.backgroundPositionY="0px"
}else{
clearInterval(timer);
timer=null;
playPauseBtn.style.backgroundPositionY="-33px"
}
}
|
|
|
|
|
|
pseudocode is nothing more than a human description of an algorithm. You don't have to describe every single line of code, just the general idea of what's going on.
BUT! You DO have to understand what the code is doing and why. That part is up to you.
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
