We Keep Coding

How to add space between Date picker and button in form of html

I tried with code like
<form>
Date: <input type="date" id="availableDate"/>
<input type="button" value="Run" id="button1">
</form>
It showed up
How can I edit that code to have space between date picker and button like

if you are trying to add space of few pixels then you can use margin property.
<form>
Date: <input type="date" id="availableDate"/>
<input type="button" value="Run" id="button1" style="margin-left: 24px">
</form>

Disable the button during the initial load, enable after the submit

I want to have the btnDisableFilteredList disabled during the initial page load. Then I want to enabled the enable it after the btnSearch button is click. How do I do it using jQuery?
<div class="panel panel-heading">
<form id="frmAutoCritical">
Search: <input type="text" name="SearchString" /><input type="submit" id="btnSearch" value="Filter" />
<input type="button" id="btnDisableFilteredList" value="Disable Filtered List" />
</form>
</div>

You need to give the btnDisableFilteredList the disabled prop first:
disabled="disabled"
Then setup an on click event listener on the btnSearch input to remove the disabled prop from the btnDisableFilteredList input.
$(function() {
$("#btnSearch").on("click", (e) => {
e.preventDefault();
$("#btnDisableFilteredList").prop("disabled", false);
});
});
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<div class="panel panel-heading">
<form id="frmAutoCritical">
Search: <input type="text" name="SearchString" />
<input type="submit" id="btnSearch"value="Filter"/>
<input type="button" id="btnDisableFilteredList" value="Disable Filtered List" disabled="disabled"/>
</form>

Try in this way:
$(document).ready(function() {
$("#btnSearch").click(function () {
$("#btnDisableFilteredList").css("display", "inline-block");
});
});
#btnDisableFilteredList {
display: none;
}
<div class="panel panel-heading">
<form id="frmAutoCritical">
Search:
<input type="text" name="SearchString" />
<input type="button" id="btnSearch" value="Filter" />
<input type="button" id="btnDisableFilteredList" value="Disable Filtered List" />
</form>
</div>
Look at this codepen
I used type="button" instead of type="submit" to avoid reloading the page, then to submit the form you can use jQuery's AJAX Function

Get input inside same <td>

How can I get previous input inside the same ?
I have the following table:
start-loop
<td>...</td>
<td>...</td>
<td align=center>
<input type="hidden" id="ContactPW" name="ContactPW" value="#UserPW#" />
<input type="hidden" id="ContactEmail" name="ContactEmail" value="#UserEmail#" />
<input type="hidden" id="ContacName" name="ContactName" value="#UserName#" />
<input class="btn btn-primary" type="button" onclick="test();" value="Login" />
</td>
end- loop
I would like to get in my test() function the values for "ContactPW", "ContactEmail", and "ContactName", but using $("#ContactPW").val() I just get the first item in the loop, not the row that I click the button.
Does anyone know how I can do it?
Thanks

in your test function, you can use jquery .parent().find() which means, your btn elem will look for parent and find the child with the name that you define. function as sample below,
html
<input class="btn btn-primary" type="button" onclick="test(this);" value="Login" />
javascript
function test(e){
$(e).parent().find("[name='ContactPW']").val();
}

PHP JS submit button

I need to develop a submit button with js but as I have a register and a login bn on the same page So, when I press the register, it goes fine but if I press the login, the login uses the register files for example.
<form name="as" method="POST" action="loginpro.php">
Username:
<input type="text" name="username" />
<br />
<br />
Password:
<input type="password" name="password" />
<br />
<br />
<input style="font-size: 17px" type=button onClick="submitform()" value="Submit"/>
</form>
This is the code that I am using to make the login form and as you can see I call a file with the name loginpro.php where I have the php settings to ask the db the files that I need but when I execute it he is calling regpro.php that is the file that I am using for register take a look.
<form name="register" method="POST" action="regpro.php">
Username:
<input type="text" name="username" />
<br />
<br />
Email:
<input type="text" name="Email" />
<br />
<br />
First Name:
<input type="text" name="fname" />
<br />
<br />
Last Name:
<input type="text" name="lname" />
<br />
<br />
Password:
<input type="password" name="password" />
<br />
<br />
<input style="font-size: 11px" type=button onClick="submitform()" value="Submit"/>
</form>

Well, it could be something in your submitform() Javascript function since both forms are triggering that function in the onclick event.

In JS, pass the form name to the function, like below:
<input style="font-size: 17px" type=button onclick="submitform('as')" value="Submit"/>
<input style="font-size: 11px" type=button onclick="submitform('register')" value="Submit"/>
And in your function:
function submitform(form) {
//will submit the form where the button was clicked from within
document.forms[form].submit();
}
jQuery (remove inline event handlers onclick="submitform()" from both forms)
$("input:button").on("click", function() {
var $form = $(this).closest("form");
$form.trigger("submit");
//OR
//$form[0].submit();
});

Why dont you give them id so you could call the onclick event for each button or other way you could use jquery like below
<input id="btnSubmit" type=button onClick="submitform()" value="Submit"/>
<script type="text/javascript">
$("#btnSubmit").click(function(){
$.post("the php page address goes here like regpro.php",
{
//here set the paramter
'firstname':$("#fname").val().trim(),
'lastname':$("#lname").val().trim()
}, function(data){
data=data.trim();
//you can retrive a data to find that the call is success or not
});
});
</script>
you could do the same with login button

Give different id for different form and use the simple way bellow
document.getElementById("your_form_id").submit();

How do I change function after clicking buttons in JavaScript?

If I have three functions A(),B(),C()
<input type="button" value="text" id="Button" onclick="A()"></input>
What should I write in function A() to make it into
<input type="button" value="text" id="Button" onclick="B()"></input>
after I click the button.

Change attribute after click:
<input type="button" value="text" id="Button" onclick="B();this.setAttribute('onclick','A()')"></input>
http://jsfiddle.net/ye87k/