I am using the below code, and my problem is that when I select the first time then the location list is not loading. When I select the second item then the first item in the sublist gets populated. If I select third then the second subitem gets populated.
I'm sure I'm making a silly mistake somewhere.
<div class="form-group">
<div class="row">
<div class="col-xs-12 col-sm-5 col-md-5">
<label for="">SELECT CLIENT</label>
<select type="search" id="myarray" class="select2-select req selectpicker form-control" data-required="1" data-max-options="1" data-live-search="true" multiple="" name="myarray[]" title="Select a Client">
<?php echo $Clients; ?>
</select>
</div>
</div>
</div>
<script>
jQuery(".select2-select").change(function() {
var selected = $(this).val();
$(".selectpicker").selectpicker();
$.ajax({
url: "<?php echo base_url(); ?>login/getDataFromLocation",
data: {
type: 'select',
selected: selected
},
type: 'post',
success: function(output) {
if (output) {
//$('#append').append(output);
$(".selectpicker").selectpicker();
$('#multiple').selectpicker('refresh').empty().append(output);
}
}
});
});
</script>
<div class="form-group">
<div class="row">
<div class="form-group col-md-5">
<label for="multiple">LOCATION</label>
<select id="multiple" class="form-control req selectpicker select2-select" data-required="1" name="Location[]" title="Select a Location" multiple></select>
</div>
</div>
</div>
Problem has been resolved and the problem was refreshing the value from list.
$("#creatives").selectpicker('refresh').empty().append(output).selectpicker('refresh').trigger('change');
Used .trigger('change')
Thanks a lot for everyone's input here.
Related
I want to update the row but when I click the update buttton return json result that message "500 Internenal Server Error". I don't find the problem. Can you check the code?
[HttpPost]
public JsonResult UpdateInStock(int stokID, int amount, int uCost, int sumCost, string detail, string unit)
{
var model = db.tbl_InStock.Where(x => x.stockInID == stokID).FirstOrDefault();
model.stockInAmount = amount;
model.stockInCost = uCost;
model.stockInSum = sumCost;
model.stockInDetail = detail;
model.stockInUnit = unit;
//db.SaveChanges();
return Json(new { result = "Redirect", url = Url.Action("Gelen", "Anasayfa") });
}
I want to update the row but when I click the update buttton return json result that message "500 Internenal Server Error". I don't find the problem. Can you check the code?
//Jquery Code
$("#uptInStock").click(function () {
var no = $.trim($("#stokInIDD").val());
var miktar = $.trim($("#amountt").val());
var fiyat = $.trim($("#unitCostt").val());
var toplam = $.trim($("#sumCostt").val());
var detay = $.trim($("#detaill").val());
var birim = $.trim($("#birimm option:selected").text());
var obj = { stokID: no, amount: miktar, uCost: fiyat, sumCost: toplam, detail: detay, unit: birim };
$.ajax({
type: "POST",
url: 'UpdateInStock',
crossDomain: true,
data: JSON.stringify(obj),
contentType: 'application/json;charset=utf-8"',
dataType: 'json',
success: function (response) {
if (response.result == 'Redirect')
window.location = response.url;
alert("Suc");
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
});
//Html Code
#using (Html.BeginForm("UpdateInStock", "Anasayfa", FormMethod.Post))
{
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Gelen Ürün - Güncelle</h5>
</div>
<div class="modal-body">
<input type="hidden" class="form-control" id="proIDD" />
<input type="hidden" class="form-control" id="stokInIDD" />
<div class="form-group">
<label class="sr-only mb-4" for="inlineFormInputGroup">Miktar</label>
<div class="proUnit2 input-group mb-4">
<div class="input-group-prepend">
<div class="input-group-text">Miktar</div>
</div>
<input type="text" class="form-control" id="amountt" />
</div>
</div>
<div class="form-group">
<select class="form-control mb-4" id="birimm" name="birim">
<option value="0">Birim Seçiniz</option>
<option value="1">Adet</option>
<option value="2">Bidon</option>
<option value="3">Koli</option>
<option value="4">Paket</option>
</select>
</div>
<div class="form-group">
<label class="sr-only mb-4" for="inlineFormInputGroup">Birim Fiyatı</label>
<div class="proUnit input-group mb-4">
<div class="input-group-prepend">
<div class="input-group-text"><i class="fa fa-try" aria-hidden="true"></i></div>
</div>
<input type="text" class="form-control" id="unitCostt" placeholder="Birim fiyatı" />
</div>
</div>
<div class="form-group">
<label class="sr-only mb-4" for="inlineFormInputGroup">Toplam Fiyatı</label>
<div class="proUnit input-group mb-4">
<div class="input-group-prepend">
<div class="input-group-text"><i class="fa fa-try" aria-hidden="true"></i></div>
</div>
<input type="text" class="form-control" id="sumCostt" placeholder="Toplam fiyatı" />
</div>
</div>
<div class="form-group">
<input type="text" class="form-control" id="detaill" placeholder="Açıklama" />
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Vazgeç</button>
<button id="uptInStock" type="button" class="btn btn-primary btn-sm">Kaydet</button>
</div>
}
Please try your url with Controller,ActionAnd Area if necessary. Below is some sample url you can try.
url:"/Area/Controller/ActionName" (in your case UpdateInStock is your action name)
url:"/Controller/ActionName"
Or you can use #Url.Action with razor syntax.
url:"#Url.Action("ActionName", "Controller")"
I solved the problem. The problem was with the numbers with commas.
var fiyat = $.trim($("#unitCostt").val());
var toplam = $.trim($("#sumCostt").val());
These fields should be converted to float values.
var fiyat = parseFloat($.trim($("#unitCostt").val()));
var toplam = parseFloat($.trim($("#sumCostt").val()));
I'm using select2 for typeahead. The functionaity works fine but it distorts my input fields.
For example this code
<div class="container">
<div class="card">
<div class="card-header">Search for a Property</div>
<div class="card-body">
<div class="row">
<!-- County Column -->
<div class="col-md-3">
<select class ="form-control" id="county" name="county">
<!--Gets all counties from DB -->
<option> - Select a County - </option>
#foreach ($county as $counties)
<option>{{$counties->name}}</option>
#endforeach
</select>
</div>
<div class="col-md-3">
<select class="town form-control" name="town">
</select>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$('.town').select2({
placeholder: 'Select an item',
ajax: {
url: '/townsearch',
dataType: 'json',
delay: 250,
processResults: function (data) {
return {
results: $.map(data, function (item) {
return {
text: item.name,
id: item.name
}})};},
cache: true
}});
</script>
Will produce the following
Image of two dropdowns.
Dropdown 1 is the way I want it. Dropdown 2 is the effect of select2. Any fixes?
I'm trying to use ng-blur. Below is my HTML code:
<div ng-if="CurrentStage==='SaveQuery'">
<div class="col-sm-12">
<div class="form-group row">
<label class="col-sm-3 control-label text-right">Query Name</label>
<div class="col-sm-9">
<input type="text" ng-blur="performValidationQueryName()" ng-model="QueryName" ng-class="QueryNameError?'form-control validation_error':'form-control'" placeholder="Query Name" />
<span ng-if="QueryNameErrorMsg!=''" class="errorMsg">{{QueryNameErrorMsg}}</span>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
JavaScript code for blur event call is:
$scope.performValidationQueryName = function () {
if($scope.QueryName != null && $scope.QueryName != '') {}
};
The issue I'm facing is:
When ng-if="CurrentStage==='SaveQuery'" is there inside div, my ng-model="QueryName" is not getting updated. And with blur of the text, I get $scope.QueryName = "" with performValidationQueryName function.
If, I remove ng-if="CurrentStage==='SaveQuery'", all things works perfectly and I get the value inside the $scope.QueryName.
How can I call ng-blur which is placed inside the div with an ng-if condition?
You should use object in your input model will solve your problem because it comes under ng-if as shown below,
Template:
<div ng-if="CurrentStage==='SaveQuery'">
<div class="col-sm-12">
<div class="form-group row">
<label class="col-sm-3 control-label text-right">Query Name</label>
<div class="col-sm-9">
<input type="text" ng-blur="performValidationQueryName(Query.Name)" ng-model="Query.Name" ng-class="QueryNameError?'form-control validation_error':'form-control'" placeholder="Query Name" />
<span ng-if="QueryNameErrorMsg!=''" class="errorMsg">{{QueryNameErrorMsg}}</span>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
Controller:
$scope.performValidationQueryName = function (queryName) {
if (queryName != null && queryName != ''){
//do something..
}
};
I have the following code:
JS
.if(() => { return this.HasProvidedEitherSku1OrSku2 === false })
.isNotEmpty().withMessage(‘at least one sku is required')
.hasLengthBetween(0, 50)
.endIf()
.ensure('Sku2', (config) => {config.computedFrom(['Sku1'])})
.if(() => { return this.HasProvidedEitherSku1OrSku2 === false })
.isNotEmpty().withMessage(‘at least one sku is required’)
.hasLengthBetween(0, 50)
.endIf();
HTML
<div class="col-sm-6">
<div class="form-group">
<label class="control-label">SKU</label>
<input disabled.bind="readonly" type="text" class="form-control" value.bind="Sku1">
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label class="control-label"> SKU</label>
<input disabled.bind="readonly" type="text" class="form-control" value.bind="Sku2">
</div>
</div>
withMessage seens to react differently when contained within an if statement. rather than adding a 'has-warning' to the form-group. It just adds:
<p class="help-block **aurelia-validation-message**">at least one sku is required</p>
How do I force a 'has-warning'? Or have something close to an if statement. If p class = "" then grab label above and input below.
I want to create a custom field validation for forms using Meteor. I don't want a packaged solution.
Here is my code so far.
JavaScript:
var errorState = new ReactiveVar;
Template.lottoForm.created = function() {
errorState.set('errors', {});
};
Template.lottoForm.events({
'blur input': function(e, t) {
e.preventDefault();
validate($(this));
}
});
Template.lottoForm.helpers({
errorClass: function (key) {
return errorState.get('errors')[key] ? 'has-error' : '';
}
});
Template.errorMsg.helpers({
errorMessages: function(key) {
return errorState.get('errors');
}
});
function throwError(message) {
errorState.set('errors', message)
return errorState.get('errors');
}
function validate(formField) {
$("input").each(function(index, element){
var fieldValue = $(element).val();
if(fieldValue){
if(isNaN(fieldValue) == true) {
throwError('Not a valid Number');
}
}
});
}
HTML:
<template name="lottoForm">
<form class="playslip form-inline" role="form">
<fieldset>
<div class="form-group {{errorClass 'ball0'}}">
<input type="text" class="input-block form-control" id="ball0" maxlength="2" name="ball0">
</div>
<div class="form-group {{errorClass 'ball1'}}">
<input type="text" class="input-block form-control" id="ball1" maxlength="2" name="ball1">
</div>
<div class="form-group {{errorClass 'ball2'}}">
<input type="text" class="input-block form-control" id="ball2" maxlength="2" name="ball2">
</div>
<div class="form-group {{errorClass 'ball3'}}">
<input type="text" class="input-block form-control" id="ball3" maxlength="2" name="ball3">
</div>
<div class="form-group {{errorClass 'ball4'}}">
<input type="text" class="input-block form-control" id="ball4" maxlength="2" name="ball4">
</div>
<div class="form-group {{errorClass 'ball5'}}">
<input type="text" class="input-block form-control" id="ball5" maxlength="2" name="ball5">
</div>
{{> errorMsg}}
<div class="play-btn">
<button type="submit" value="submit" class="btn btn-primary">Play Syndicate</button>
</div>
</fieldset>
</form>
</template
<template name="errorMsg">
<div class="errorMsg">
{{#if errorMessages}}
<div class="list-errors">
{{#each errorMessages}}
<div class="list-item">{{> fieldError}}</div>
{{/each}}
</div>
{{/if}}
</div>
</template>
<template name="fieldError">
<div class="alert alert-danger" role="alert">
{{errors}}
</div>
</template>
I'm also getting this error message in the console - "Uncaught Error: {{#each}} currently only accepts arrays, cursors or falsey values."
Why do I get this error and how would I implement the custom validation?
Just as the error says, #each template functions must be passed the proper type. Are you sure your errorMessages helper is returning an array? It looks like you are initializing it as a hash.