asp.net FileUpload 'open' click to copy title - c#

I am using a asp.net FileUpload control to upload files. There is a 'Title' text box which allows user to enter file title as well. The 'Upload' button then uploads the file to the server. This is all working fine. My problem however is that, customer has asked to copy the file name automatically to the title 'text box' in case user wants the custom title to be the same as file name.
Unfortunately, I am unable to figure this one out. I thought there would be an event behind the 'open' button of the file upload, that I could tap into and just as the title gets displayed on the fileupload control, similarly it should also get displayed on my title text box field. Perhaps Javascript/JQuery might help.
Any help in the right direction would be greatly appreciated. Many thanks

You can use the input's change event with jQuery:
$(function () {
$('input:file').on('change', function () {
console.log($(this).val());
})
})
You will probably have to parse the value to remove the "fakepath" stuff that some browsers add.
You can do this using the split method:
var title = $(this).val().split('\\');
console.log(title[title.length - 1])

Related

Checked value disappear after post back

I am using below tutorial to create image check box
enter link description here
it works properly but once page post back it lose the checked element and cannot retrieve it .
is there any solution for this issue?
This is absolute normal if you not save the post back somewhere and then render again the controls with the one that is selected with that class active, the rest controls with out that class...
See the javascript code from your page:
$(function () {
$('.btn-radio').click(function(e) {
$('.btn-radio').not(this).removeClass('active')
.siblings('input').prop('checked',false)
.siblings('.img-radio').css('opacity','0.5');
$(this).addClass('active')
.siblings('input').prop('checked',true)
.siblings('.img-radio').css('opacity','1');
});
});
The selected have the active class !, so after the post back, save the user selection and render the selected control with that class.

Check extension of choosing picture in SP 2013 Picture Library

I need to check pictures extension when user has chosen picture and try to upload it into picture library.
I've found the way to edit master page with js script, but i haven't to edit master page. Then i try to use event receiver Adding, but it can't get the name of file or file path. I used:
var file = properties.ListItem.File.Name; //properties.ListItem - returns null
AfterProperties also returns null.
The another way i see is to edit Adding Picture form with js:
I think is's simplest way but i can't found information about it.
Problem: how to set js script to the form (see picture) or how to do such actions with another way
It can be realized with event receiver ItemAdding and with
properties.AfterUrl
The same answered question with code in:
Customizing upload file functionality in SharePoint picture library
In your case, a simple JS form validation will do.
First I would prevent default action of the submit button.
Then, I would analyze the contents of the filename textbox and check the extention. If it's not one of the listed in the validation script, return false + alert "THis file extention is not supported".
Why would you want to use event receiver? It catches the event on server side.

How to stop users from manually editing file path in HTML file input control?

I have a asp.net form with 5 HTML file input controls with runat=server and a submit button. after user selects the files and clicks the submit button, the files are upload in the server.
Problem is the HTML file input controls are editable, and user can edit the path after he has already selected the file from the browse button.
If he enters a invalid file path, the file is not uploaded because it does not exist.
How can I stop users from manually changing the file path? I have tried to make the controls read only, but it disables the browse button also.
You can't. Write your server side logic to cope with missing uploads.
you could try something like having a hidden field and when the user selects the file from browse, it populates to the hidden field as well. Then when they upload, you either read from the hidden field for your upload or using JS replace the values back to the original control and read from that.
Is this what you want to have...
You can do like that hiding the control when user select the file
and showing only the path to the user
in a div
if he disagree, let him click on a link called Choose Another next to the path div, so when user click Choose another toggle the same div with flushing the previous value
see this fiddle : http://jsfiddle.net/T2D3X/
While brian's suggestion works (Thank you brian for this), finally we decided to follow the server side handling approach. since in case of invalid file, the file size would be zero, so the response is instant and we do not need to wait till the file is uploaded because in this case there is not file in the first place.
//check if file exists
if (uploadCtrl.PostedFile.ContentLength > 0)
{
uploadCtrl.PostedFile.SaveAs(fileNameWithPath);
uploadCtrl.Dispose();
}
else
{
fileNameWithPath = "invalid";
}
You can also use these methods:
One before validating: http://jsfiddle.net/T2D3X/1/
One After validating: http://jsfiddle.net/T2D3X/2/
Friend of mine posted the same answer before I have re-modified it.
There are some internal jsfiddle error on second link you can ignore that, i have just added more functionally to check on submit what value exactly you are sending.
Let us know if you find the it helpful ;)
Thank!

Highlight selected text and save it

I am interested in saving text when user selects any text anywhere on a web page that text has to be highlighted and has to save that text as a string in C#.
when same user saw same page next time text has to be highlighted as done previously by him.
If anyone knows a simple elegant way to do this I would really appreciate it, but I'll take any solution at this point. Even if you can point me in the right directions that would be appreciated.
Thanks in advance.
You need to write service WCF or Webservice in server side that will receive userId and text and save it into database.
[WebMethod(Description = "Save Text")]
public string Savetext(int userId ,string text)
{
}
Second method will retrive the text from daatabase by user id
[[WebMethod(Description = "Get text")]
public string GetText(int userId)
{}
In client side do invokation using Ajax calls (Jquery)
Use this to get selected text from page: http://mark.koli.ch/2009/09/use-javascript-and-jquery-to-get-user-selected-text.html
Then in mouseup event copy it to some HiddenField. Now you need a button or maybe AJAX call in mouseup so you can send it to server. On the server side save it to DB along with UserID and page address or ID.
On the next visit of this user to this page check in DB for entry. If it exist put the text in some hidden field. Then using jQuery get that text clientside, find it on page (using regex or something) and select it. You should remember to disregard any HTML markup while finding the text which can be tricky...
That is general way I would take to do this.
you can do that by capturing the selected text and send it via ajax call to your database.
check this example to know haw you can capture the selected text.
If you use jquerythen you will use select() function to capture the selected text
<textarea id="txt"></textarea>
<script>
$(document).ready(function(){
$('textarea').select(function()
{
var selectedText=window.getSelection();
//here put the ajax call to your webservice
});
});
</script>

How to handle async file upload in uploadify?

I have a uploadify plugin on my page and below it I have a description field and a textbox for it. I have submit button below it. Now my problem is uploadify will start async file upload as soon as you select file. I want the uploadify to start upload on click of submit button and also description field's value to be available on the server. I am aware that there is option where you can ask uploadify to start upload on the click of some button. But even if I do that the submit button click event will be fired and the upload will be lost. Should I use script manager and update panel (uploadify should not be inside update panel) so that when submit button click event is fired the page doesn't reset and the uploadify can continue its work. How do you all typically handle this?
Thanks in advance :)
To disable auto start of the file upload, add this setting to the config of the uploadify:
'auto' : false
To submit the values of the form to the server along with file you need to create a separate link or button that gets the data from the form and send it using the uploadifySettings function and then call uploadifyUpload().
Here is an example that will send the details of an MP3 file filled in a form by user.
<a onclick="$('#file_upload').uploadifySettings('scriptData', { 'artist':$('#t_artist').val(), 'album':$('#t_album').val() }); $('#file_upload').uploadifyUpload()" class="greenBtn">START UPLOAD</a>
Where #t_artist and $t_album are the IDs of the input fields in the form.

Categories

Resources