Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App
geeksforgeeks
Browser
Continue

Related Articles

jQWidgets jqxFileUpload fileInputName Property

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

jQWidgets is a JavaScript framework for making web-based applications for PC and mobile devices. It is a very powerful and optimized framework, platform-independent, and widely supported. jqxFileUpload is a widget that can be used to select files and upload them to a server.

The fileInputName property is used to set or return the name attribute of the hidden file input. It accepts string type values and its default value is ”.

Syntax:

  • Set the fileInputName property:

    $('Selector').jqxFileUpload({ fileInputName : string});
  •  

  • Return the fileInputName property:

    var fileInputName = 
        $('Selector').jqxFileUpload('fileInputName');

Linked Files: Download jQWidgets from the given link. In the HTML file, locate the script files in the downloaded folder:

<link type=”text/css” rel=”Stylesheet” href=”jqwidgets/styles/jqx.base.css” />
<script type=”text/javascript” src=”scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxfileupload.js”></script>

Example: The below example illustrates the jqxFileUpload fileInputName property in jQWidgets:

HTML




<!DOCTYPE html>
<html lang="en">
    
<head>
  
    <link type="text/css" rel="Stylesheet" 
          href="jqwidgets/styles/jqx.base.css" />
    <script type="text/javascript" 
              src="scripts/jquery-1.11.1.min.js">
    </script>
    <script type="text/javascript" 
              src="jqwidgets/jqxcore.js">
    </script>
    <script type="text/javascript" 
            src="jqwidgets/jqxbuttons.js">
    </script>
    <script type="text/javascript" 
            src="jqwidgets/jqxfileupload.js">
    </script>
    
</head>
    
<body>
    <h1 style="color: green">
          GeeksforGeeks
    </h1>
    
    <h3>jQWidgets jqxFileUpload fileInputName property</h3>
    
    <div id="gfg"></div>
    
    <script type="text/javascript">
        $(document).ready(function () {
            $('#gfg').jqxFileUpload({ 
                theme: 'energyblue',
                width: 300,
                uploadUrl: 'upload.php',
                fileInputName: 'fileInput'
            });
        });
    </script>
</body>
    
</html>

Output:

Reference: https://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxfileupload/jquery-file-upload-api.htm


My Personal Notes arrow_drop_up
Last Updated : 14 Nov, 2021
Like Article
Save Article
Similar Reads
Related Tutorials