I set data attribute for kendo dropdown list as below.
.HtmlAttributes(new {style = "width:100%", required = "required" ,data_id= item.Id})
I tried like this
$(this).data("id");
but it gives as "undefined". how I get this data attribute value in change event
I Use as below and it works for me
this.element.attr('data-id');
Related
I have a requirement to provide placeholder for all controls in my TPC form. I wanted to know if there is a way to do so. I have tried placing placeholder in Template like:
<input id='#Html.GetUniqueId(Model.Name)_input' data-tpc-role="lookup-input" name="#Model.MetaField.FieldName" data-tpc-default-value="#Model.GetLookupValue()" data-tpc-value="#Model.GetLookupValue()"
placeholder ="myplaceholdertext" type="text" #MvcHtmlString.Create(#Model.ValidationAttributes) data-tpc-custom-validation="lookup"/>
and through script
$(document).on("tpc:ready", function(){
var picklistName = "mypicklistname";
//Set Text to Placeholder Value
tpc.forms[0][picklistName].get_kendoInput().text("Please select an option.");
});
None of these work.
Let me know if this is the correct forum to ask TPC related questions
TIA
You have the kendo control but the value you want to set is the first item in its dataSource. Don't forget to refresh the control to make it show:
$(document).on("tpc:ready", function(){
var picklist = tpc.forms[0]["mypicklistname"];
//Set Text to Placeholder Value
picklist.get_kendoInput().dataSource.data()[0].Label = "Please select an option.";
picklist.get_kendoInput().refresh();
});
I am using PrimeNG in my angular app, I have issue with p-dropdown
Question
I have two dropdowns for country and caste_category, I provide caste_reservation for only India , in case of other country selection , the OPEN option from caste_category needs to get selected and make the disable that dropdown.
If I have well understood your need, you have to set onChange event on country dropdown. This event will call a method that will trigger disabled property on caste dropdown depending on the country selected. It will also select OPEN option on this dropdown if the country is not India.
HTML
<p-dropdown [options]="countries" [(ngModel)]="applicant.country" (onChange)="updateCountry()"></p-dropdown>
<p-dropdown [options]="castes" [(ngModel)]="caste" [disabled]="disableCasteDropdown"></p-dropdown>
TS
updateCountry() {
if(this.applicant.country!=='India') {
this.disableCasteDropdown = true;
this.caste = 'o';
} else {
this.disableCasteDropdown = false;
this.caste = null;
}
}
See Plunker
Is it what you're looking for ?
If you are using Directive form controls you can disable the input, dropdown etc... by adding disabled: true in the form control
Using disabled attribute in html results to this message in console :
It looks like you're using the disabled attribute with a reactive form directive. If you set disabled to true
when you set up this control in your component class, the disabled attribute will actually be set in the DOM for
you. We recommend using this approach to avoid 'changed after checked' errors.
Example:
form = new FormGroup({
first: new FormControl({value: 'Nancy', disabled: true}, Validators.required),
last: new FormControl('Drew', Validators.required)
});
Using can 2.2 : I'm having trouble getting a radio input field to be checked by default when also using the can-value attribute.
The relevant part of the stache template looks like this:
<input type="radio" name="visibility" value="corporate" can-value="reportData.visibility" checked="checked"/>
The relevant part of my viewModel looks like this:
can.Map.extend({
reportData = {
visibility: 'corporate',
}
});
I want the input value to be live-bound to my view model. According to the can 2.2 docs, I can use the can-value attribute on an input to reference a property on my view model and keep it in sync with the value of the input's value. My problem is the checked="checked" doesn't result in the input being checked by default, though the value on the input item (corporate) is being correctly live-bound. If I remove the can-value attribute, the check appears by default. How can I get both live-binding and a checked input by default with the help of can-value?
I have an Index page which shows a list of data. The list can be filtered by selection from a dropdown list. This works okay. The first item in the dropdown has a blank value and the text "(all users)." So, this does what you expect--it shows all values in the list if you don't select an item to filter by. The razor for this is pretty simple:
#using (Html.BeginForm())
{
#Html.Label("userName", "View user:")
#Html.DropDownList("userName", ViewBag.UserName as SelectList, new { onchange = "this.form.submit()" })
}
In addition to viewing the list of data on the page, I offer a text file download of the currently filtered items. The razor for this is also pretty simple:
#using (Html.BeginForm("Download", "Checkout"))
{
#Html.Hidden("userName", Request["userName"])
<input type="submit" value="Download Metadata from Checked Out Files" />
}
This works right IF there's something selected in the filter dropdown. But if nothing is selected, then Request["userName"] returns "System.Web.Mvc.SelectListItem". I want it simply to be blank as the dropdown list appears when nothing is selected. What happens is that the value System.Web.Mvc.SelectListItem is passed to my download action and treated as a filter value.
So, the question is how to make it so a blank selection in my filter dropdown is not mistaken for "System.Web.Mvc.SelectListItem."
Try changing your #Html.DropDownList to this overload, string.Empty gives you the default blank option in your dropdown
#Html.DropDownList("userName", ViewBag.UserName as SelectList, string.Empty, new { onchange = "this.form.submit()" })
I hope I didn't misunderstand your question!
I have a Windows 8 app with a template that contains a div I want to show or hide based on the value of a property inside a data-win-control="WinJS.Binding.Template". I have tried the following without luck:
<div data-win-bind="visible: isMore"> ..content... </div>
where isMore is a boolean property of the databound item.
How can I do that? I guess the visible property does not exist?
You are right - the visible property doesn't exist, but you can control the appearance using CSS and a binding converter.
First, use WinJS.Binding.converter to create a converter function that translates a boolean to a value value for the CSS display property, like this:
var myConverter = WinJS.Binding.converter(function (val) {
return val ? "block" : "none";
});
Make sure that the function is globally available - I use WinJS.Namespace.define to create collections of these converters that I can get to globally.
Now you can use the converter in your data binding to control the CSS display property, like this:
<div data-win-bind="style.display: isMore myConverter"> ..content... </div>