I have a "Loading..." element as a div right now. Right now, it runs whenever I come to the page it is on, but I'd like for it to only come up when I click on a button and go away when that function is done loading.
The "Loading..." div code:
<div id="MSG" class="ui-widget-overlay ui-front" title="">
<div class="center spinner-preview" id="spinner-preview">Loading....</div>
</div>
And I'd like for it to only activate when the following button is clicked and that is currently loading.
<div id="Verify"><input type="submit" class="btn btn-lg btn-primary" value="Verify Login & Save" /></div>
I can't seem to get it to work though. Any help would be appreciated, thanks.
Set your loading div display hidden.
on click of you button show your div and then perform your task.
hide div again.
Related
I created a form with many sections the user can save the form using a button at the end of the form or a button that is kept in a fixed side nav. The structure is like this (with additional CCS to keep the form blocked).
<form id="myform" action="" method="POST" role="form">
<div class="sidenav">
<a> some section links</a>
<a> some section links</a>
<button type="submit" class="btn-success">SAVE</button>
<a class="btn-danger" onclick="return confirm('Leaving the page, might cause loosing the data not saved.');" href="/">Leave the page.</a>
</div>
<div class="main">
<div>
... a lot of stuff
</div>
<div>
<button type="submit" class="btn-success">SAVE</button>
</form>
A beta tester using Chrome told me that the button on the side nav sometimes is not working, while the one on the bottom is always working, but I can't reproduce this behaviour in my browsers or understand the causes.
Is there something I am missing? Which is the correct implementation of a form with two submit button?
I would like to create a html/php page with a button that can click on the draw button on this page http://andivia.com.sg/dnd/luckydraw.html
I have this html page http://andivia.com.sg/dnd/luckydraw.html which will be displayed on a projector.
I would like to create another html/php page to trigger the buttons on the above link
<body>
<h1>Lucky Draw Result</h1>
<div id="Result">
<span id="ResultNum">Result</span>
</div>
<div id="Button">
<input type='button' value='Draw' onclick='beginRndNum(this)' />
<input type='button' value="Confirm" onclick="skipCandidate()" style="display: none" />
</div>
<div class="imported">
<table id="Data"></table>
</div>
<div id="Report" hidden="true">
<ul id="messagebox"></ul>
</div>
</body>
How can I trigger this button from another html/php page?
When I click on the button on the newly created page, it will trigger http://andivia.com.sg/dnd/luckydraw.html to start the draw.
Soultion 1
you can use concept of websocket API,
if you click on button of other page you will send websocket packet. And on this page if you receive this package you can call the stop function and you will get the desired result
Solution 2
You can keep flag in DB, suppose True and False, if you click on button of other page you will set flag to True. On this page you will continuously hit the API to check the status of the flag. If the flag is True you can call stop function
But, first solution is good practice
this is our code; we tried to link a page with a button, but the page is not opening,instead after clicking the button it redirects to the same page as the button.
The code for the button is:
<a href="search.html"><div class="form-group">
<button name="signup" class="btn btn-lg btn-primary btn-block" type="submit">Send Query</button></div></a>
Please help us debug this.
I think you should add your css classes on the link so it looks like a button Send Query
Your question is not clear at all, try this code,
Send Query
Make sure that you have placed the files in same directory?
And then Try this code :
<div class="form-group">
Signup
</div>
Then you may give your anchor tag look and feel same like button.
I am encountering a weird problem with buttons in a page.
I have three buttons as action buttons, but the third button click event is never called.
Basically the functionality of 3 buttons are "Prev", "Next", "Exit". initially "Prev" button is disabled. Now both "next" and "Exit" buttons are enabled. The click event on the "Next" is working but the click event on "Exit" is not working. When i hover my mouse the hover function also does not work on this button.
But when i click "Next" now it automatically starts working. I have no idea what is going on.
Here is the code for buttons
<div id="controls">
<input type="button" id="prev" name="prev" value="Prev" disabled="" />
<input type="button" id="next" name="next" value="Next" />
<input type="button" id="exit" name="exit" value="Exit" />
</div>
The binding for these buttons are as follows -
$('#next').bind('click', next);
$('#prev').bind('click', prev);
$('#exit').bind('click', exit);
I have tried to replace the button with another button, tried a different javascript function but nothing works.
Also if i interchange "next" and "Exit" buttons, now "Exit" will work and "next" will not work. This is really getting annoying. I have tried all sort of debugging but no luck
any help is appreciated.
Thanks.
I have a submit button that on click, jquery checks if anything has been selected. If not then it does show() on an error message. Here's the html:
<p id="error_message" style="display:inline">dfd</p><input type="submit" class="button" name="Submit" value="Submit" />
At the beginning the message is hidden, but then revealed if the user clicks submit without selecting an option. The problem is, the displaying on my text shifts my submit button. This is what the submit looks like without the message:
And here's what it looks like after the message is displayed:
As you can see, the submit button moves to the right. I have to display inline if I want both the error message and submit to appear on the same line but how do I prevent any movement? Thanks
if you set the button to float:right; it stays on the right end of its container, until content from left div forces it to drop to next row.
so html:
<div class='container'>
<p id='error_message' style='display:inline;float:left;' >dfd </p>
<input type='submit' style='float:right;' name='submit'>
</div>
set the position of the button to absolute , OR set the width of the error-message to something fixed