I have a JavaScript function that sets a ViewBag value whenever you mouse up on a radio checkbox. I'm trying to submit the ViewBag in a hidden field on my form.
My JavaScript function is successfully getting the id. But I'm unable to get that value into my hidden form. I think my first problem is i'm using a ViewBag when I should be using a different type. But this is where I'm hoping to get some assistance. How can I set a value in a JavaScript and get that in a #Html.HiddenFor()?
$(document).ready(function () {
$('body').on('mouseup', 'td', function (e) {
e.preventDefault();
var id = $(this).attr("id");
#Html.Raw(Json.Encode(ViewBag.id)) = id;
});
});
#Html.HiddenFor(model => model.id, new {id = "id", Value = #Html.Raw(Json.Encode(ViewBag.id)) })
***UPDATE WORKING SOLUTION BELOW****
I'm marking #Ali Soltani solution as the correct answer. His answer lead me in the right direction. Here is my full working code:
$(document).ready(function () {
$('body').on('mouseup', 'td', function (e) {
e.preventDefault();
var id = parseInt($(this).attr("id"));
$("#Id").val(id);
});
});
Form:
#Html.HiddenFor(model => model.id, new { id = "Id" })
You can set the value attribute of a hidden input tag by selecting it using the property name and using the jquery val() method.
$("#id").val(id); // id in $("#id")
You should use $("#id") because you used model.id. Second id is var id = $(this).attr("id"); and just you need razor code like this if id in model.id is unique:
#Html.HiddenFor(model => model.id)
Related
If I have the following piece of code:
<button id="btnOne" data-football="Mitre">Press Me</button>
How would I get the name of the data tag, so in this case it would be 'data-football'. I know how I would get the value but would like to know how I can get the name of the data-tag - in this case data-football when the button is pressed.
i.e,
$(document).on("click", "button", function(){
// Get the name of the attribute (data-football - not the value);
});
Thanks.
You can use attributes property for getting the all attributes of a HTML tag
<div id="_id" data-football='test'></div>
<script>
const attrs = document.getElementById('_id').attributes
const keyName = attrs[1].nodeName // will be data-football
</script>
Try one of the following.
$(document).on("click", "button", function(){
$(this).data('data-football')
});
Or
$(document).on("click", "#btnOne", function(){
$(this).data('data-football')
});
Read More about jQuery data
I need to get element value of #answer_comment and show it inside input with id #comment
$(document).ready(function() {
$("body").on("click", "#answer_comment", function(e) {
var answer = document.getElementById('answer_comment').val();
$('#comment').val(answer);
})
what is wrong?
Also if possible, how to create a cookie with the selected value?
Hope this is what you are looking for since it is a span you can get the value using attr('value')
$("body").on("click", "#answer_comment", function(e) {
var answer = $('#answer_comment').attr('value');
$('#comment').val(answer);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id = "answer_comment" value="username">click here</span>
<input id="comment">
you are mixing jQuery with vanilla JS. You should pick a horse and stick to it. Pure JQ would be
$(document).ready(function() {
$("body").on("click", "#answer_comment", function(e) {
var answer = $('#answer_comment').text();
$('#comment').val(answer);
})
I'm grabbing the value of an input and setting this as a variable. How can I then use this as part of the selector name. Here's a demo of where I've got too and what I'm trying to achieve
// grab the id
var rowId = $('input[name="row-id"]').val();
// Use the variable as part of selector
$('body').on("click", ".upload-form-'rowId'", function(event) {
// do stuff here
})
The output of the selector would be like .upload-form-99 for example
Why not just do this:
// grab the id
var rowId = $('input[name="row-id"]').val();
rowId = '.upload-form-' + rowId;
// Use the variable as part of selector
$('body').on("click", rowId, function(event) {
// do stuff here
})
Any particular reason that this wouldn't work?
$('body').on("click", ".upload-form-" + rowId, function...
Here's a more elegant solution if you happen to be using ES6:
// grab the id
let rowId = $('input[name="row-id"]').val();
// Use the variable as part of selector
$('body').on("click", `.upload-form-${rowId}`, (event) => {
// do stuff here
})
#Html.ValidationMessageFor(m => m.name, "", new { id = "valName" })
I need to assign value for "valName" using JavaScript or jQuery.
Is there any way to assign value to the id?
It is not clear exactly what you want to do?
If you want to change the id of the validation message DOM element:
document.getElementById('valName').id = 'newId';
// or via jQuery
$('#valName').attr('id', 'newId');
If you want to change the text of the validation message DOM element:
document.getElementById('valName').innerHTML = 'new content';
// or via jQuery
$('#valName').html('new content');
This should work:
$(document).ready(function () {
$('[class^=field-validation]').each(function () {
var id = "val" + $(this).attr("data-valmsg-for");
$(this).attr("id", id);
});
});
It will set the id to the same as the form field but prefixed with "val".
I have a simple form with a few textboxes on it. I would like to capture the input of the textboxes, modify it slightly and then append it to the form action URL.
$('.myBox').on('change', function (event) {
var myVal = $(this).val();
$('form').attr('action').appendTo("&MyVal="+myVal);
});
The above code doesn't work because there is no appendTo to the attr value. Is there another way to accomplish this?
Your syntax isn't quite right as you want to update the value of the action attribute, not append an element. Try this:
$('.myBox').on('change', function (event) {
var myVal = $(this).val();
$('form').attr('action', function(i, value) {
return value + "&MyVal=" + myVal;
});
});
You can try this one:
$("form").attr('action',$("form").attr('action')+ "&MyVal=test");
I actually came up with something similar.
$('.Mybox').on('change', function (event) {
var action = $('form').attr('action');
$('form').attr('action',action+"&test");
});
But I think I like yours better. Thanks