Validation uploadify - jquery-plugins

I am using jQuery Uploadify to upload files to my site. How can I tell if a user has selected a file or not? I tried using the folder object value of the Uploadify object
but its not working for me--it's always the same. I assume that it was null before it was selected.
How can I tell that a user has selected a file?

You could try something like this:
<script type="text/javascript">
var selected = false;
$(document).ready(function() {
$('#fileInput').uploadify({
'uploader' : 'uploadify.swf',
'script' : 'uploadify.php',
'cancelImg' : 'cancel.png',
'auto' : true,
'folder' : '/uploads',
'onSelect' : function() { selected = true; },
'onCancel' : function() { selected = false; }
});
});
</script>
Then you can test if 'selected' is true/false.

Related

Laravel getting value of checkbox in ajax Error :Cannot read property 'checked' of null

I am showing the checkbox value checked or unchecked based on the db value.but when user try to change it like unchecked it and update the value. i call the ajax i getting this error.
Thanx for help
Code
<div class="{{count($employees) !=0 ? 'sidebar-hide': 'sidebar-customize'}}">
<a>
{{ Form::checkbox('Employee','1',$user->employee) }}
<i class="fa fa-id-card"></i>
<span>Employee</span>
</a>
</div>
Below is the Ajax Function
$(document).ready(function(){
$('#customize').click(function(e){
e.preventDefault();
var customers=document.getElementById('customers').checked ? '1' :'0' ;
var accounts=document.getElementById('accounts').checked ? '1' :'0';
var Inventory=document.getElementById('InventoryItems').checked ? '1' :'0';
var Employee=document.getElementsByName('Employee').checked ? '1' :'0';
console.log(Employee);
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
url :"{{ url('user')}}",
type :'POST',
data :{
customer : customers,
accounts : accounts,
inventory: Inventory,
employee : Employee
},
dataType: 'JSON'
// ,
// success: function( data ) {
// $("#ajaxResponse").append(data.msg);
// console.log(data);
//}
});
});
});
Is the HTML created dynamically?
If so, then you need to bind the event to a parent element and use the jQuery.on() method instead of click()
$('#parentelement').on('click', 'div.sidebar-customize', function(e) {
//code
});
The second parameter of the method needs to target the element you're trying to use. From you HTML, I can't tell what that will end up being. Maybe implement an additional class or ID so the HTML can be targeted better.
its like i have to include the Id from the checkbox
{{ Form::checkbox('Employee', 'Employee', $user->employee, ['id' => 'employee']) }}
Ajax Code :
$(document).ready(function(){
$('#customize').click(function(e){
e.preventDefault();
var employee=document.getElementById('employee').checked ? '1' :'0' ;
console.log(employee);
});
});
Works prefectly fine as aspected

infinite scrolling doesn't work when the popup appears

I installed an extension for my magento store, that make a quickview modal in the products list (imedia quickview - it' actually a bootstrap modal ) and works nice, but due to many products in the list i add a script for infinite scroll (http://infiniteajaxscroll.com/vendor/jquery-ias/dist/jquery-ias.min.js). Everything was fine, until i saw that the infinite scoll doesn't seems to work if the modal popup appears.
Here it's what I've done so far:
<pre>
<script type="text/javascript">
jQuery(window).load(function(){
activatePopup();
// Initialize the pagination plugin
var ias = jQuery.ias({
container : ".category-products",
item : ".product-item ",
next : "a.next",
pagination : '.pages',
loader : "<img src='/img/sys/loader.gif' />",
triggerPageThreshold : 0,
});
// Pagination plugin callback function
ias.on('rendered', function(items) {
activatePopup();
});
});
function activatePopup() {
var baseUrl = '<?php echo Mage::getBaseUrl(); ?>';
var containerClass = 'category-products';
$('.'+containerClass+' li').each(function(e){
var productId = $(this).find('.quick_view_btn').attr('id');
$(this).click(function(){
$(this).find('.quick_view_btn').html('Incarca..');
$.ajax({
type: "POST",
url: baseUrl+"quickview",
data: "id="+productId,
success: function(msg){
//$("html, body").animate({ scrollTop: 0 }, "slow");
$('.'+containerClass+' li .quick_view_btn').html('MAI MULT');
$('#modal .main-content').empty().append(msg);
$('#modal').css({'display': 'block', 'top':'50%','visibility':'visible','opacity':'1'});
$('body').css('overflow', 'hidden');
// popup submit validation
}
});
});
});
}
</script>
</pre>

How can I update form value from ajax result

I use ajax to retrieve data.
How can I fill that return data to my jsp form.
This is ajax code.
$('#ppmerchant').click(function(){
var mNo = $('#inpMerchantNo').val();
$.ajax({
'url' : 'updatePPMerchant',
'type' : 'GET',
'data' : {
'merchantNo' : mNo
},
'success' : function(data) {
if (data != null) {
var info = $(data).find("tab_1_1_2");
$("tab_1_1_2").html(info.html());
}
}
});
});
It's show me form design.But not show the value.
Thanks in advance
If you have a form you can directly set the value using javascript
see the below example
<form>
First name:<br>
<input type="text" id="name" name="firstname">
</form>
<script>
document.getElementsById("name").value = myValue;
</script>
My value is the data you wish to set.
--remove ' '(single quote) in ajax options type--and try rerun !!!
$.ajax({
url : 'updatePPMerchant',
type : 'GET',
data : {
merchantNo : mNo
},
success : function(data) {
if (data != null) {
var info = $(data).find("tab_1_1_2");
$("tab_1_1_2").html(info.html());
}
}
});

Uploadify formData not coming over

I'm trying to implement Uploadify into a classic ASP application. The values I'm passing in the settings formData are not available in upload.asp. I've tried putting formData in it's own option field and that isn't working either.
Funny part is that I can 'see' it in Fiddler...so I'm not sure what the heck is going on.
Below is my uploadify code. In upload.asp a call to request.form("sellerid") is blank.
Any ideas?
<script type="text/javascript">
$(function() {
$("#file_upload").uploadify({
'method' : 'post',
'swf' : 'uploadify.swf',
'uploader' : 'upload.asp',
'onUploadStart' : function(file) {
$("#file_upload").uploadify("settings", "formData",
{ "sellerid" : "999", "sellerloginid" : "joeseller" }
);
}
});
});
</script>

How to pass multi rows edited in jqgrid to server controller?

I'm new in jqgrid.
I want to pass multi rows edited in jqgrid to pass MVC server controller.
controller expects json string type of data.
how my jsp pass all rows to controller?
jQuery("#save").click( function(){
alert("enter save fn");
var gridData=jQuery("#gridList").jqGrid('getGridParam','data');
jQuery.ajax({
url : '/uip/web/p2/saveEmployeeList.dev'
,type : 'POST'
,cache : false
,data : JSON.stringify(gridData)
,contentType : 'application/json; charset=utf-8'
,dataType : 'json'
})
});
I print out HttpServletRequest in controller. there is one row exist.
even little clue would be helpful.
If I understand you correctly you want to save all edited rows by one Ajax action instead of a Ajax request after any row is edited?
If so, this might be the solution. Instead of Ajax you use the 'clientArray' option in your configuration as your URL parameter. This causes jqGrid to save every edited row internally in JavaScript and post nothing to your server.
With a onclick on a save button you could do something as follows:
var changedRows = [];
//changedRows is a global array
if($('#save-rows').length) {
$('#save-rows').click(function() {
var postData = {}
$.each(changedRows, function(key) {
postData[key] = $('#paymentsgrid').jqGrid('getRowData', this);
});
$.post(baseUrl + '/controller/action', {
'data' : postData
}, function(response) {
$('<div></div>').html(response.content).dialog({
'title' : 'Message',
'modal' : true,
'width' : 800,
'height' : 400,
'buttons' : {
'OK' : function() {
$(this).dialog('close');
}
}
});
if(response.reload) {
$('#grid').trigger('reloadGrid');
}
}, 'json');
});
}
Also important is to specify a save event in your grid:
$('#paymentsgrid').jqGrid('saveRow', paymentController.lastsel, null, 'clientArray', null, function(rowId) {
changedRows.push(rowId);
});
You might should modify or optimize some things but in the basic, this should work or give you an idea how to accomplish what you want.

Resources