The below code works fine, while fetching.. but i don't want the subflag div occupying the space which affects the submit button in displaying in correct position. Is there any other way possible to pass the values to app.js
app.post("/activitieslist/:id/edit", function(req. res) {
var astname = req.body.astname;
var subflag = req.body.subflag;
console.log(astname, subflag);
});
<form action="/activitieslist/<%= activitylist._id %>/edit" method="POST">
<div class="form-group">
<label>Asset Name :
</label>
<input class="form-control" type="text" name="astname" value="<%= activitylist.astname %>">
</div>
<div class="form-group invisible">
<input type="text" name="subflag" value="N">
</div>
<button class ="btn btn-info"><i class="fas fa-edit"></i>Save</button>
</form>
Related
i am trying to save body of post form in mongodb.
Everytime i get this result only.
{ _id: new ObjectId("63f222995b85f79e258642c4"), __v: 0 }
HTML form code
<form action="/" method="post">
<div class="item11 bg12">
<input id="inph" type="text" class="in bg1" placeholder="Phone number, username or email address">
</div>
<div class="item11">
<input id="inpass" type="text" class="in bg1" placeholder="password">
</div>
<div class="item11">
<button type="submit" id="btlog" class="in bg2">Log in</button>
</div>
</form>
node js code
const credential=mongoose.Schema({username:String,password:String});const cr_den=mongoose.model('instagram_clone',credential);
app.get('/',(req,res)=>{res.render('index.pug');})
app.post('/',(req,res)=>{var data=new cr_den(req.body);data.save().then(()=>{console.log("response Noted..!!");console.log(data);}).catch(()=>{console.log('Failed To Save Data...!!!')})res.render('index.pug');})
The result should be
{ _id: new ObjectId("63f222995b85f79e258642c4"), username:"xyz",password:"xyz",__v: 0 }
I try to auto calculate html input values to show total values in input .
here is my input form
<div class="col-sm-4">
<form>
<div class="mb-3">
<label for="">Price</label>
<input type="text" id="price" required class="price form-control">
</div>
<div class="mb-3">
<label for="">Amount</label>
<input type="text" id="amount" required class="amount form-control">
</div>
<div class="mb-3">
<label for="">Total</label>
<input type="text" id="total" required class="total form-control">
</div>
<button type="submit" class="btn btn-primary marketbuy">Buy </button>
</form>
</div>
I want total value automatically when enter amount value and price value into input form.
example
price is 3
amount is 5
total is 15
when I enter 3 and 5
total input show automatically 15
var p1 = $('#price').val();
var p2 = $('#amount').val();
$('#total').val(p1*p2);
console.log()
this code not show directly in total input but show when reload.
How can get by jquery.
The issue is because your code is only running when the page loads. You need to hook event handlers to the input fields so that the total also gets calculated as the user enters values.
Below is a working example of how to do this. Note that the common logic which updates the total field is extracted to its own function which is called when the page loads and also when a field is updated. Also note that I added the required attribute to the total field so that the user cannot update it - it can only be set programmatically.
let $price = $('#price');
let $amount = $('#amount');
let updateTotal = () => $('#total').val($price.val() * $amount.val());
updateTotal(); // on page load
$('form input').on('input', updateTotal); // on value change
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="col-sm-4">
<form>
<div class="mb-3">
<label for="">Price</label>
<input type="text" id="price" required class="price form-control" />
</div>
<div class="mb-3">
<label for="">Amount</label>
<input type="text" id="amount" required class="amount form-control" />
</div>
<div class="mb-3">
<label for="">Total</label>
<input type="text" id="total" required class="total form-control" readonly />
</div>
<button type="submit" class="btn btn-primary marketbuy">Buy</button>
</form>
</div>
$('form input').on('keyup',function(){
$('#total').val(parseInt($('#price').val()*$('#amount').val()));
});
<!-- The issue is because your code is only running when the page loads. You need to hook keyup event handlers to the input fields so that the total also gets calculated as the user enters values.-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="col-sm-4">
<form>
<div class="mb-3">
<label for="">Price</label>
<input type="text" id="price" required class="price form-control" />
</div>
<div class="mb-3">
<label for="">Amount</label>
<input type="text" id="amount" required class="amount form-control" />
</div>
<div class="mb-3">
<label for="">Total</label>
<input type="text" id="total" required class="total form-control" readonly />
</div>
<button type="submit" class="btn btn-primary marketbuy">Buy</button>
</form>
</div>
I have 2 separate forms in HTML and want to send them via a single button. How can I do that? When I try to make them into one form by removing the start and end in the middle, the div tags and CSS messes up. Here is my code.
<div class="contact-bottom">
<div class="col-md-6 contact-left">
<form>
<input type="text" placeholder="Name" required="">
<input type="text" placeholder="E-mail" required="">
<input type="text" placeholder="Phone" required="">
</form>
</div>
<div class="col-md-6 contact-left">
<form>
<textarea placeholder="Message"></textarea>
<input type="submit" value="SEND">
</form>
</div>
<div class="clearfix"> </div>
</div>
Use ajax to post values !
Exemple:
<script>
$(document).ready(function(){
$("#submit").click(function(){
$.ajax({
type: 'post',
url: "mail.php",
data: { "name" : $("#mail-name").val() ,"email" : $("#mail-email").val() },
success: function($response) {
alert($response);
}
});
});
});
I have some fields inside a form tag and submit button outside a form tag. If any of the fields inside a form is empty my form should not be submitted. For this I used the required attribute but it was not working since submit button was outside of the <form> and also used novalidate attribute. Nothing seems to work.
Below is my code:
<section id="profile" class="content-header">
<div class="thumbnail">
<button type="submit" class="btn btn-block btn-success" ng-if="!viewProfile" ng-click="updateProfile();">SUBMIT</button>
</div>
<div class="row">
<form name="profileForm" role="form">
<div class="form-group col-md-6">
<label for="firstName"> First Name </label>
<input type="text" class="form-control" id="firstName" ng- model="profileDetails.firstName" ng-disabled="viewProfile" required/>
</div>
<div class="form-group col-md-6" ng-if="userDetails.role==0">
<label for="firstName"> Middle Name </label>
<input type="text" class="form-control" id="middleName" ng- model="profileDetails.middleName" ng-disabled="viewProfile" />
</div>
</form>
</div>
</section>
like FirstName and MiddleName there are many other fields without filling any of those fields my form should not be submitted, can anyone suggest me the best approach for this. My angularController is:
(function() {
function profileController($scope, profileFactory, $loading) {
$scope.updateProfile = function() {
$loading.start("main");
profileFactory
.updateProfile($scope.profileDetails)
.then(function(response) {
var updatedUserDetails = response.user;
if (updatedUserDetails.imagePath !== null) {
$scope.profileDetails.imagePath = updatedUserDetails.imagePath;
$scope.profileDetails.profieImageBytes = updatedUserDetails.profieImageBytes;
}
angular.extend($scope.userDetails, $scope.profileDetails);
$scope.editProfile();
})
.catch(function() {
$loading.finish("main");
});
};
$loading.finish("main");
}
profileController.$inject = ["$scope", "profileFactory", "$loading"];
angular
.module("vResume.profile")
.controller("profileController", profileController);
})();
You typically use the .$invalid field on the form with ng-disabled for this.
<button type="submit" class="btn btn-block btn-success" ng-disabled="profileForm.$invalid" ng-if="!viewProfile" ng-click="updateProfile();">SUBMIT</button>
See the angularjs docs.
I am using AngularJs and have inputs with predefined value from ng-repeat. I want resend those data value via ng-click function to treat data.
The problem the data is not submitted
<label>Price</label>
<input type="text" class="form-group form-control" ng-value=s.prix required="required" ng-model="prix" >
</div>
<div class="modal-footer">
<button type="submit" id='submit' ng-click="edit()" class="btn btn-primary" data-dismiss="modal">Save</button>
s.prix is a value of column in the table prix (ng-repeat="s in produit") if you know what i mean.
Use ng-repeat instead as model
Like this
<input type="text" class="form-group form-control" required="required" ng-model="s.prix" >
Then pass object in edit.
Try like this
ng-click="edit(s)"
JS
$scope.edit=function(s){
console.log(s);
}
html:
<body ng-controller="myCtrl">
<label>Price</label>
<div ng-repeat="s in produit">
<input type="text" class="form-group form-control" required="required" ng-model="s.prix" >
<button type="submit" id='submit' ng-click="edit(s)" class="btn btn-primary" data-dismiss="modal">Save</button>
</div>
</body>
controller:
myApp.controller('produitCtrl', ['$scope',function($scope){
$scope.produit = [{prix:'hello'}];
$scope.edit=function(s){
console.log(s);
}
}]);