Error while sending image through ajax to WCF

Posted by Samar Rizvi on Stack Overflow See other posts from Stack Overflow or by Samar Rizvi
Published on 2012-10-05T03:36:05Z Indexed on 2012/10/05 3:37 UTC
Read the original article Hit count: 186

Filed under:
|

Here is my form:

<form id="register" enctype="multipart/form-data">
    <input type="text" name="first_name" placeholder="First Name" id="first_name" />
    <input type="text" name="last_name" placeholder="Last Name" id="last_name" />        
    <input type="text" name="input_email" placeholder="Confirm your email"  id="input_email" class="loginEmail" />
    <input type="password" name="input_password" placeholder="Password" id="input_password" class="loginPassword" />
    <input type="password" name="repeat_password" placeholder="Repeat password" id="repeat_password" class="loginPassword" />
    <input type="file" name="image_file" id="image_file" />

    <div class="logControl">
        <div class="memory"></div>
        <input type="submit" name="submit" value="Register" class="buttonM bBlue" id="register_submit"/>
        <div class="clear"></div>
    </div>
    <p><h3>Or click <a href="login.html">here</a> to login</h3></p>
</form>

Here is jquery call that I make:

     function WCFJSON() {
         $(".memory").html('<img src="images/elements/loaders/7s.gif" />');
         Data = new FormData($('form')[0]);
         $.ajax({
             type: 'POST', //GET or POST or PUT or DELETE verb
             url: "WCFService/Service.svc/Register", // Location of the service
             data: Data, //Data sent to server
             async:false,
             cache:false,
             contentType: false, // content type sent to server
             dataType: DataType, //Expected data format from server
             processdata: false, //True or False
             success: function(msg) {//On Successfull service call
                 ...
             },
             error: ...// When Service call fails
         });
     }

     $(document).ready(function(){
         $("#register").submit(function(){
            $('#input_password').val(CryptoJS.MD5($('#input_password').val()));
            $('#repeat_password').val(CryptoJS.MD5($('#repeat_password').val()));
            WCFJSON();
            return false;
        });
    });

Now when I submit the form , page refreshes with get elements in the url. But if I remove the file input from the form, jquery works fine.

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about form-data