Friday, 8 November 2013

How to Upload an Image using LightSwitch htmlclient in sql server and in SharePoint List?

In LightSwitch we can upload an image. If we are using sqlserver then we can upload an image and store this image in database. But If we are using Sharepoint list then we have to create list of Document Library, Image will upload to this list and storing the path of the Image to general list. Like this we can solve Image uploading problem.

Storing Image in Sql Server

I am using the student master example. I have created a table of a student master which is storing student pic. and I am trying to Upload this image in the database.

Steps: 1. Create a master screen using this table 

2. Now create an PopUp Dialog and a  button as shown below. Also set that button to Use the Created Popup Dialog.



3. Now we have to do the Important part of our application. We have to download  two files and add them to the following Location. Also add the reference of java script file to the default.htm file. 

image-uploader.js
image-uploader-base64-encoder.aspx

<script type="text/javascript" src="Scripts/image-uploader.js"></script>

4. In the Properties window, choose the Edit Render Code hyperlink or select the “Write Code” button at the top right of the designer and select the _render method.

myapp.StudentMasters.Pic1_render = function (element, contentItem) {
    // Write code here.
    createImageUploader(element, contentItem, "max-width: 500px; max-height:300px");
};

Hit the F5 button and we are able to upload the file to the database



Storing Image in SharePoint List

Upcoming

2 comments:

Unknown said...

Excellent help, simple and straight forward. Worked great!
Thanks

Unknown said...

ImagerJs is a platform-independent, web-based JavaScript
Image Uploader that is very easy and fun to use. A JavaScript library
for uploading images using drag & drop. Crop, rotate, resize,
or shrink your image before uploading https://www.imagerjs.com visit us you wont
be sorry! Have a nice day.