I'm doing an xhr file upload using dojo.io.iframe.send and it works fine in all browsers except IE 8. IE8 sends a GET request instead of a multipart POST. This is my code:
dojo.io.iframe.send({
form: this.logoForm.domNode,
handleAs: "json",
method: "POST",
url: '/backend/design/uploadLogo',
load: dojo.hitch(this, function(response) {
if (response.error) {
errorFunc(response);
} else {
this.submitStatusLogo.innerHTML = "Your logo has been successfully uploaded.";
this.logoButton.hideIndicator();
dojo.addClass(this.submitStatusLogo, "success");
if (response.logoPath) {
this.productLogo.innerHTML = '<img src="'+response.logoPath+'" alt="" />';
}
}
}),
error: errorFunc
});
And this.logoForm.domNode is:
<form dojoAttachPoint="logoForm" dojoType="dijit.form.Form" enctype="multipart/form-data" class="designLayoutForm">
<div class="uploadedImage" dojoAttachPoint="productLogo"></div>
<h2>Logo
<span dojoType="sc2.common.TinyHelp" title="Logo">
Upload a product logo that will be shown in the top left of the demo page.<br />
If the logo is higher than 80 pixels, it will be resized to a height of 80px. <br />
<br />
<i>Supported file types are: png, jpg, gif, bmp.</i>
</span>
</h2>
<p>
<input type="hidden" dojoAttachPoint="logoForm_product" name="product" value="" />
<input type="hidden" dojoAttachPoint="logoForm_XSessionVerify" name="X-Session-Verify" value="" />
<input type="file" name="file" dojoAttachPoint="logoInput" />
</p>
<p dojoAttachPoint="submitStatusLogo" class="submitStatus"></p>
<p>
<input dojoType="sc2.form.IndicatorButton" dojoAttachPoint="logoButton" label="Upload">
</p>
</form>
What am I doing wrong?
Okay I solved it, adding method="POST" to the form element did the trick. Apparently specifying method: "POST" in the send parameters was not sufficient for IE8. Thanks for your time anyway
Related
SiteFinity noob here.
I've edited the widget via File Manager: Resource Packages>Bootstrap>MVC>Views>Captcha.
the file there is "Write.default.cshtml". I changed the following line-
<img data-sf-role="captcha-image" src='#Url.WidgetContent("assets/dist/img/dummy.jpg")'/>
to
<img data-sf-role="captcha-image" alt="captcha Image src='#Url.WidgetContent("assets/dist/img/dummy.jpg")'/>
However, although saved, this doesn't show up in the widget code when I put it on my form. I used File Manager, as I dont have a connection via .net editor.
Am I in the wrong place? Do I need to somehow restart the application?
Here is complete code:
#model Telerik.Sitefinity.Frontend.Forms.Mvc.Models.Fields.Captcha.CaptchaViewModel
#using Telerik.Sitefinity.Frontend.Mvc.Helpers;
#using Telerik.Sitefinity.Modules.Pages;
#using Telerik.Sitefinity.Services;
#Html.Script(ScriptRef.JQuery, "top", false)
<div data-sf-role="field-captcha-container" style="display:none;" class="#Model.CssClass form-group">
<div>
**<img data-sf-role="captcha-image" src='#Url.WidgetContent("assets/dist/img/dummy.jpg")'/>**
</div>
<a data-sf-role="captcha-refresh-button">#Html.Resource("NewCode")</a>
<div class="form-inline">
<div class="form-group">
<input data-sf-role="violation-messages" type="hidden" value='{"required": "#Model.ValidatorDefinition.RequiredViolationMessage"}' />
<label for='#Html.UniqueId("Textbox")'>#Html.Resource("TypeCodeAbove") </label>
<input id='#Html.UniqueId("Textbox")' type="text" data-sf-role="captcha-input" name="#Model.CaptchaAnswerFormKey" required="required" class="form-control input-sm"/>
</div>
</div>
<input type="hidden" data-sf-role="captcha-ca" name="#Model.CaptchaCorrectAnswerFormKey" />
<input type="hidden" data-sf-role="captcha-iv" name="#Model.CaptchaInitializationVectorFormKey" />
<input type="hidden" data-sf-role="captcha-k" name="#Model.CaptchaKeyFormKey" />
<input type="hidden" data-sf-role="captcha-settings" value="#Model.GenerateUrl"
</div>
#if (SystemManager.IsDesignMode)
{
var scriptUrl = Url.WidgetContent("Mvc/Scripts/Captcha/captcha.js");
var queryAddition = scriptUrl.Contains("?") ? "&" : "?";
var fullScriptUrl = scriptUrl + queryAddition + string.Format("_={0}", DateTime.UtcNow.Ticks.ToString());
<script type="text/javascript" src='#fullScriptUrl'></script>
}
else
{
#Html.Script(Url.WidgetContent("Mvc/Scripts/Captcha/captcha.js"), "bottom", false)
}
You'll need to make sure you are using the Bootstrap package. Go to Design > Page Template and see which resource package your page templates are using. Often times it's not the Bootstrap, but a copy of it.
A restart may help as well.
EasyUi combtree dose't working inside the form tag, It's fine other than form tag
Mark Up
<form>
<div class="form-group">
<label for="searchfolder"><?php echo \Application\Plugin\Common::z_xlt('Move to Category'); ?></label>
<div class="custom-dropdownclass custom-documents">
<inputclass="form-control easyui-combotree " ng-value="currentdocument.category" data- realcatcode="{{currentdocument.category}}" name="parent" id ="searchfolder" data- options="input:searchfolder">
</div>
</div>
<form>
Script
$http({
method: 'post',
url: basePath + '/documents/documents/ajax',
data: data
}).then(function(response) {
$('#searchfolder').combotree('loadData', $scope.getDirectTreeComboData(response.data.directorytree));
$('#newfolder_parent').combotree('loadData',
$scope.getDirectTreeComboData(response.data.directorycombotree));
});
Error Image of console error
I want to add a dropzone inside an existing form but it doesn't seem to work.
When I view the console I get error throw new Error("No URL provided"). When I click upload I get no preview either - all I get is a normal file input.
<link href="../dropzone.css" rel="stylesheet">
<form action="/" enctype="multipart/form-data" method="POST">
<input type="text" id ="Username" name ="Username" />
<div class="dropzone" id="my-dropzone" name="mainFileUploader">
<div class="fallback">
<input name="file" type="file" />
</div>
</div>
<div>
<button type="submit" id="submit"> upload </button>
</div>
</form>
<script src="../jquery.min.js"></script>
<script src="../dropzone.js"></script>
<script>
$("my-dropzone").dropzone({
url: "/file/upload",
paramName: "file"
});
</script>
No url provided error is because $("my-dropzone") is wrong instead it must be $('#mydropzone')
dropzone along with other form, yes this is very much possible, you have to post the data using the URL provided in the dropzone not in the form action. That means all your form data along with the files uploaded shall be posted back to the url provided for the dropzone. A simple untested solution is as below;
<link href="../dropzone.css" rel="stylesheet">
<form action="/" enctype="multipart/form-data" method="POST">
<input type="text" id ="Username" name ="Username" />
<div class="dropzone" id="my-dropzone" name="mainFileUploader">
<div id="previewDiv></div>
<div class="fallback">
<input name="file" type="file" />
</div>
</div>
<div>
<button type="submit" id="submitForm"> upload </button>
</div>
</form>
<script src="../jquery.min.js"></script>
<script src="../dropzone.js"></script>
<script>
$("#mydropzone").dropzone({
url: "/<controller>/action/" ,
autoProcessQueue: false,
uploadMultiple: true, //if you want more than a file to be uploaded
addRemoveLinks:true,
maxFiles: 10,
previewsContainer: '#previewDiv',
init: function () {
var submitButton = document.querySelector("#submitForm");
var wrapperThis = this;
submitButton.addEventListener("click", function () {
wrapperThis.processQueue();
});
this.on("addedfile", function (file) {
// Create the remove button
var removeButton = Dropzone.createElement("<button class="yourclass"> Remove File</button>");
// Listen to the click event
removeButton.addEventListener("click", function (e) {
// Make sure the button click doesn't submit the form:
e.preventDefault();
e.stopPropagation();
// Remove the file preview.
wrapperThis.removeFile(file);
});
file.previewElement.appendChild(removeButton);
});
// Also if you want to post any additional data, you can do it here
this.on('sending', function (data, xhr, formData) {
formData.append("PKId", $("#PKId").val());
});
this.on("maxfilesexceeded", function(file) {
alert('max files exceeded');
// handle max+1 file.
});
}
});
</script>
The script where you initialize dropzone can be inside $document.ready or wrap it as a function and call when you want to initialize it.
Happy coding!!
I am a newbie and tried to do the laziest way to do a file upload using emberjs, jquery and formdata(IE10+). The code might look stupid, but it worked.
Here is what i got. Can you please take a look and give some suggestions. Am i doing it wrong?
<script type="text/x-handlebars" data-template-name="posts">
<form role="form" enctype="multipart/form-data" method="post" id="fileinfo" {{action 'createPost' on='submit'}}>
{{input type="text" value=newPost id="newPost" placeholder="Post" class="form-control"}}
{{input type="file" id="inputFile" class="form-control" name="file"}}
<button type="submit" class="btn btn-default" >Submit</button>
</form>
</script>
App.PostsController = Ember.ArrayController.extend({
actions: {
createPost: function(){
var fd = new FormData(document.getElementById("fileinfo"));
fd.append("postContent", this.get('newPost'));
this.set('newPost', ''); //reset text field
$('#inputFile').val(''); //reset fileinput field
Ember.$.ajax({
url: "http://localhost:3000/posts",
type: "POST",
data: fd,
processData: false, // tell jQuery not to process the data
contentType: false, // tell jQuery not to set contentType
});
}
}
});
I ran into this problem and I cant solve it.
Basically Im making an app for a social network website. Its a forum about computers.
I have no problems loggin in using NSURLConnection and maintain the session. But I cant post a new thread.
Can someone please help me how to do this via obj-c? some code are below here.
html code to submit a new thread
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery.load.min.js"></script>
<script type="text/javascript" src="js/jquery.iphone.js"></script>
<form id="form-newreply" action="/newreply.php" method="post">
<textarea name="message" style="width:95%;height:120px"></textarea><br />
<input type="hidden" name="do" value="postreply" />
<input type="hidden" name="parseurl" value="1" />
<input type="hidden" name="t" value="1375204" />
<input type="hidden" name="loggedinuser" value="170189" />
<input type="hidden" name="p" value="" />
<input type="submit" name="sbutton" value="Send" /></form>
jquery.iphone.js contains this
// reply
$('#form-newreply').live('submit', function(){
$.ajax({
url: '/newreply.php',
data: {
'do': 'postreply', 'parseurl': 1,
't': $(this).find('input[name=t]').val(),
'p': $(this).find('input[name=p]').val(),
'loggedinuser': $(this).find('input[name=loggedinuser]').val(),
'ajax': 1, 'ajax_mobile': 1,
'message': $(this).find('textarea[name=message]').val()
}, type: 'POST', timeout: 20000,
contentType: "application/x-www-form-urlencoded;charset=ISO-8859-1",
success: function(data){
if (data.match(/postid:(\d+)/)) {
var sID = data.replace(/postid:/, '');
loadPage('sp-' + sID + '.html#p' + sID);
} else {
var aM = data.match(/<!--POSTERROR do not remove this comment-->([^<]+)?<ol><li>([^<]+)/);
if (aM && aM.length == 2 && aM[1].length) {
alert(aM[0]);
} else {
alert('ERR');
}
}
}
});
return false;
});
I was able to do it using this plugin:http://allseeing-i.com/ASIHTTPRequest/How-to-use