ghanshyam.mirani
ghanshyam.mirani

Reputation: 3101

Set Fileupload size through Jquery

I have FileUpload Control on my Page:

 <asp:FileUpload runat="server" ID="fuAttachment" CssClass="fileUploadCSS" size="76" />

I want to change size of this Control on Button's Click event though Jquery.

How do i set it? because ($("#fuAttachment").size doesn't working. and ($("#fuAttachment").width returns null

Thanks in Advace

Upvotes: 2

Views: 467

Answers (2)

user1135379
user1135379

Reputation: 136

You have control over various elements of the FileUpload control's style. For design purposes you may want to temporarily add a solid border, it will give you a better perspective to see how the width is actually adjusted. In FireFox and Chrome there is no border around the textbox of the FileUpload control, there is for IE. Without the border it appears that width doesn't change in FF, Chrome. For example, the script below changes font size, background color and the width (which will be clear with a border added).

<script>
      $(document).ready(function() {
      $("#FileUpload1").css('font-size', '25');
      $("#FileUpload1").css('background-color', 'red');
      $("#FileUpload1").css('border', 'solid');
      $("#FileUpload1").css('width', '800');         
          });          
  </script>

Hope this helps.

Upvotes: 0

Grrbrr404
Grrbrr404

Reputation: 1805

Try this for your button onclick method:

$('#fuAttachment').css('width',200);

You can find more information about the jQuery css method here

Update

During my conversation with devjosh i came up with this line of code

$('#fuAttachment').attr('size', 50);

It seems that the size attribute is much more supported in modern browsers than change the css width property.

You cann see a working example here: http://jsfiddle.net/CY3jG/1/ (Tested in IE 8 and FF 9)

Upvotes: 2

Related Questions