Friends,
I'm working on changes to an existing code base someone else created. They used Razor Html.TextBoxFor in many places. I need to add another textbox using the same model property in a second place on the same form:
#Html.TextBoxFor(model => model.EnrollmentToBatchDataContract.NameKey)
The problem I have is that Razor is rendering the same ID for both instances of this textbox. I need to enable and disable the textbox's independent of each other.
Any insight would be greatly appreciated.
#Html.TextBoxFor(model => model.EnrollmentToBatchDataContract.NameKey, new { #id = "new id" })
The second parameter changes the Html object values. Any property from the Html tag could be put between the braces and changed.
This does not work on EditorForModel if you need to do that aswell, last time I tried.
Related
I am faced with the question of how I should set up my Angular components with regard to inputs.
The first variant would be to create an input variable for each given value. This means that you would have to enter each variable individually when calling it:
The second variant would be to pack all the required values in a model and only include this model. So in the end only one input:
Now I don't know which of the two variants is better suited for a large app with many components.
Is there one i should prefer from these two or are there more i dont know yet?
It depends upon your component info what info you are passing for example if the component is a shared button in which expected inputs could be button name, class, status etc.
In that scenario instead of passing all inputs separately you could go with one object lets say props which contains button properties.
export interface IButtonProps {
text: string;
class: string;
disabled?: boolean;
}
buttonData: IButtonProps;
this.buttonData = {
...this.buttonData,
text: 'Submit',
class: 'primary',
disabled: false
}
In template instead of passing individual input pass an object of buttonData
<my-button [props]="buttonData"></my-button>
Your example doesn't really explain itself too well but here goes:
If your input's are all of the same type and used for the same thing, theres nothing wrong with putting all of them in an array and passing them to the child.
Instead of:
[input]="'string1'" [input2]="'string2'" you could do [input]="['string1', 'string2']"
However consider this:
[iconClass]="'my-icon-class'" [buttonClass]="'my-button-class'"
Each of the inputs do something completely different, so putting them inside of an array would be very bad practice.
What you could also do is put all inputs in an object, for example:
input = { iconClass: 'my-icon-class', buttonClass: 'my-button-class' };
[input]="input"
You should only be using this, if the inputs are somehow related or/and do the same thing / modify the same element in the child.
i am currently working on to display the value in textboxes after adding row to the table. I am new to angular and seems i could not find the solution. At the moment, everytime i click on the Add button, the table will add new row but somehow the value that i have entered previously are gone. I need to make the value stays in the textbox every time the user adds new row.
Here is the source code that i have done:
https://stackblitz.com/edit/angular-hxduqp
Thank you.
That happens when you have multiple inputs with the same name.
One way to fix it is by giving your input names a suffix of your iterator i:
<input ... [name]="'from' + i" ...>
Here is your StackBlitz corrected:
https://stackblitz.com/edit/angular-bgdgpr?file=src/app/app.component.html
You just remove the name from the form control if not required else you need to provide the unique name to each control.
Working copy is here - https://stackblitz.com/edit/angular-gpq9nc
There is a button on a website at the end of a form that I cannot seem to click with WWW::Mechanize. Here is the bit of HTML pertaining to this button:
<input type="submit" class="saveButton" value="Login">
When I print $mech->find_all_inputs();, I get return this:
HTML::Form::TextInput=HASH(0x7f8f52cdc450)
HTML::Form::TextInput=HASH(0x7f8f5302b488)
HTML::Form::SubmitInput=HASH(0x7f8f52cdc108)
The third one is the one I want to click. I'm not exactly sure how to click this button even though I've found it. I tried click(field(n => 3)), I tried assigning a variable $submit to find_all_inputs(3), then click($submit);, and no matter what, this button is not clicked.
Can anyone guide me as to how to click this elusive button?
Edit (after question answered)
Interrogating the HTML form found I was actually entering the password for the login into the 'Forgot my Password' field of the form. Why this field was not coming up for $mech->find_all_inputs(), I don't know since "Login" was. Either way, clicking the button takes me to the next page. Thanks!
Since it is the first button in the form, you can write this
$mech->click_button( n => 1 )
or, since it's value attribute is Login, you can do this
$mech->click_button( value => 'Login' )
But since it is the only button in the form, just
$mech->click
should work fine
Did you try to select the appropriate form first, then call click? It says (my emphasis)
Has the effect of clicking a button on the current form.
Find which form on the page you need. Let's say it's form number 2.
# $ua is the User Agent (Mechanize object), at the appropriate page
$ua->form_number(2);
# fill the form ...
my $response = $ua->click();
or
$ua->submit_form(
form_number => 2,
# fields => { name => $value } # can fill it here as well
};
I find click to be perhaps more reliable overall.
To inspect the forms you can use my #forms = $ua->forms. To fill the form you can use select or set_fields, for example. See Form Methods and Field Methods. All this operates with HTML::Form objects so you can use its methods as well. For example, value_names and possible_values are handy.
If this doesn't help please give us more detail -- the web page in question would be ideal.
I am trying to set the value in an HTML input text box which is a part of ComponentA from the typescript code which is a part of ComponentB.
Taking a clue from this SO i tried doing:
(<HTMLInputElement>document.getElementById("name")).value = response.name;
But this is not working. Is there anything else i need to take care of?
EDIT: The element with Id "name" is in ComponentA and the above code that is trying to manipulate that element is in ComponentB
If you are trying to set the value of component1's textfield from the compoenent2 then you must have to use of ngModel i.e two way data binding. by providing component2 in the providers list you are able to access all the functions and variables of that component, then you can easily set your value. like this
suppose this is your component 2's value property
name:string = 'Pardeep Jain';
than you can access this in component like this-
<input type="text" [(ngModel)]='name'>
....
constructor(private delete1: Delete){
this.name = this.delete1.name;
}
Working Example
Also
(<HTMLInputElement>document.getElementById("name")).value = response.name;
is used to set the value of current template's field with id named as **name**
This is one of the cases when user interaction on one component ComponentA triggers an update on another component ComponentB.
This article describes multiple approaches, with example code, on how to pass information between components.
My personal favorite is the third approach mentioned in that article in which one of the component (say ComponentA) "listen" for update it is concerned about from any component (say ComponentB) via a service in between them, resulting in a loosely coupled components.
For more approaches here is another link.
I know I'm not supposed to use the Viewbag and that I should build a menu using Html.DropDowlListFor() so that i can add attribute bound to the members of the model, BUT, that would involve a pretty extensive code rewrite....
I have a custom controller with a menu:
*.ASCX
<%: Html.DropDownList("CityIDs", new SelectList(ViewBag.cities, "Id", "Name"), "--Select--", new { style = "width:200px" })%>
<%= Html.ValidationMessage("CityIDs") %>
The List populates just fine and I can default to the top item to "--Select--"
The prbolem is that I want the validation error to occur on anything that is not from the viewbag.... how can I achieve this?
Validation for dropdown lists only ensures that something was posted. If you want to ensure that the value that was posted is actually one of a set of "allowed" values, then you'll have to manually do that in your post action:
var cityIds = db.Cities.Select(m => m.Id);
if (!cityIds.Contains(model.CityIDs))
{
ModelState.AddModelError("CityIDs", "You must select one of the available choices.");
}
if (ModelState.IsValid)
{
...
Two things:
Notice that I'm pulling the city ids straight from the database (the actual code you'd need here, of course, depends on your specific implementation). The important thing, though, is that ViewBag only survives a single request, so you can't look for them in ViewBag after posting.
Despite the pluralized name of CityIDs, using the DropDownList helper ensures that only a single selected value will exist. If this is actually supposed to be a multiselect, then you need to use ListBox instead, and update this conditional here to account for check for multiple values.
Populates the top item with Text = "--Select--" and Value = ""
which will post a blank value for CityIDs and cause an error in ModelState.