I need to display the file name after choose the file from file input on a HTML page(<input type=file>).I am using Ruby on rails(Probably it doesn't matter).Pls give me some hint
$('input[type="file"]').change(function(){
var file_name = $(this).val();
});
check the fiddle : http://jsfiddle.net/cGVCB/
I don't know Ruby, but i'm shure you can use Javascript / jQuery:
alert($('#idOfYourUploadField').val());
Combine it with a change listener, or something, to get it on every change.
Related
I'm trying to save whole page as HTML file included all already written values into inputs. I tried this:
$("#content").html();
but it wont save values from inputs.
$("#content").get(0).outerHTML;
$("#content").prop('outerHTML');
Works same but still not save values of inputs. I need function which save everything on the page.
You need to set up each input values first:
$('#content input').each(function() {
$(this).attr('value', $(this).val());//set up all the input values
});
var html = $('#content').html(); //now from here you can get input values
You could try:
$("html").html();
If you want to also capture the hmtl tags you could concatenate them to the html like this:
function getPageHTML() {
return "<html>" + $("html").html() + "</html>";
}
you have save the inputs values in some variable like
var input=$("#input-id").val()
When an input is changed by the user it's .value is being changed. .value is not in the DOM, it's in the JS. So, what you need to do is transfer the .value to value= in order to be able to get it in the string. Here is how to accomplish it:
$('input').each(function(index, input){input.setAttribute('value', input.value)});
Now try to get the HTML ;)
PS: You could also modify the selector here, not to get all the inputs (like type="password").
I have an asp.net webform where I include the following script (on a separate .js file):
function pageLoad() {
var mpe = $find("mpeEmpresa");
mpe.add_shown(onShown);
$addHandler(document, "keydown", onKeyDown);
}
function onShown() {
var background = $find("mpeEmpresa")._backgroundElement;
background.onclick = function() {
$find("mpeEmpresa").hide();
}
}
Unfortunately, it won't work because asp.net 3.5 changes the elements id's. The only way I could get it to work is to use ctl00_ContentPlaceHolder1_empresaFilha_mpeEmpresa as the ID.
Sure I could use <%= mpeEmpresa.ClientID %> from the asp.net side, it would work but I'll have to pass that as a var to my external .js file and it's not exactly what I'm trying to accomplish.
I have searched on a few ways to select the element by it's ID name partially, but couldn't get any of them to work... Is there a guaranteed way?
I can see the JQuery tag on your question, so you can easily use this:
$('div[id*="mpeEmpresa"]')
As i know the ContentPlaceHolders are rendered as div.
Update:
If you need to select empresaFilha too so you can't use the above selector.
because $('div[id*="mpeEmpresa"]') select both of ctl00_ContentPlaceHolder1_empresaFilha and ctl00_ContentPlaceHolder1_empresaFilha_mpeEmpresa.
so you need to use this:
Select only mpeEmpresa:
$('div[id*="mpeEmpresa"]').css("background-color","blue");
Select only empresaFilha:
$('div[id*="mpeEmpresa"]').parent('div[id*="empresaFilha"]').css("background-color","red");
Or something like this, maybe this code isn't so optimized because i don't see your ASP code or rendered HTML so have to provide a general solution.
You can simply use this
var mpe=$('div[id$="mpeEmpresa"]');
or
var mpe=$find('div[id$="mpeEmpresa"]');
I have a "Label" control on my form which is being populated via jquery. My problem however, is I need to return my string with html tags, but my label doesn't seem to recognize html. Here's my control:
<label id="comment"></label>
And here's how I'm working with it in javascript:
var comment;
comment = $("#comment");
comment.text("<b>Please scan an <br/>item!</b>");
In the above code, the html in my string is ignored. Is there any way I can get my form to recognize the returned html tags?
Thanks
Use the html function :
comment.html("<b>Please scan an <br/>item!</b>");
try comment.html("<b>Please scan an <br/>item!</b>");
You could also use document.getElementById("comment").innerHTML = "<b>Please scan an <br/>item!</b>";
comment.html("<b>Please scan an <br/>item!</b>");
I have a JS file CharacterSelection where a user can select an avatar and type their name into a textarea.
Now I want to set a text div in an html file to the contents of the textarea. I will use it to display the player's name at a specific location on the screen.
I know that I can set a div to a text, such as: <div id ="statSheetExitButton">Exit</div> will show "Exit" (style and location depending on css)
I'm wondering if there is any way to put a String variable in there, since I will not know what name the player enters.
I grab the textarea's contents using var name = $("#nameTextBox").val();
I'm thinking that saying <div id ="playerName">name</div> will display the text "name".
Is there a way to accomplish my goal?
$("#nameTextBox").change(function(){
$("#playerName").html($(this).val());
});
This will attach an event handler to the textbox so everytime the name changes the div is updated.
Here is a working example. http://jsfiddle.net/2NkTb/
Please note that for the onchange event you must tab out of textbox or the textbox must lose focus
var name = $("#nameTextBox").val();
$("#playerName").html(name);
Do this:
var name = $("#nameTextBox").val();
$('#playerName').text(name);
You could do something like this which will replace the html of the tag with your JavaScript string:
$('#playerName').html(myNameVar);
Other than that, I don't think you can directly inject JavaScript variables like you would in a template language.
Try:
$('#playerName').html($("#textbo").val());
var playerName = 'John Dow'
document.getElementById('playerName').innerHTML=playerName
You need to set the property innerHTML of you div element.
$("playerName").innerHTML = name;
I would like to copy the value of a input:file to input:text. I can do it with plan JavaScript but I will like to know how to do it with jQuery.
----JavaScript
// This what the script would look like with plain JavaScript
// It works fine. I just woulld like to know who to do it with jQuery.
function fakeScript() {
var filepath;
filepath = document.adminForm.tumb.value;
filepath = filepath.substring(filepath.lastIndexOf('\\')+1, filepath.length);
document.adminForm.tumbFake.value = filepath;
}
If you have something that works in "plain Javascript", it'll work with jQuery too : jQUery is just a library, that adds functions -- it doesn't prevent anything from working (or there is some kind of bug in it ^^ )
var fileValue=$("input[type='file']").val();
var inputValue=$("input[type='text']").val(fileValue);
cheers
You probably cannot use the value attribute of a file input with JQuery.
"The value attribute cannot be used with <input type="file">." - http://www.w3schools.com/tags/att_input_value.asp
To get the text value of a file from an <input type="file"/> element, use yourFileInputElement.files[0].getAsText("utf-8").