I have a button on a form that I need to click and it looks something like this
<button id="****" class="****">Click Me</button>
I am using the following code to click other buttons which works fine but that is because the other buttons has a value="*****" assigned to it
$oButtons = _IETagnameGetCollection($oIE, "button")
For $oButton in $oButtons
If String($oButton.value) = "Click Me" Then
_IEAction($oButton, "click")
EndIf
Next
I know that the $oButton.value is what is getting the value for the button, but what other "operator" is there besides value that can get the anchor text of the button?
The example that you posted should be used only in a situation when you don't have an ID of the element. ID is always unique.
If the button that you want to click has an ID, you can use it as a reference to that button.
EXAMPLE:
HTML:
<button id="MyButton" class="someClass">Click Me</button>
CODE:
$oBtn = _IEGetObjById($oIE, "MyButton")
_IEAction($oBtn, "click")
Apart from .Value you can use all of the below:
$oBtn.innerText
$oBtn.outerText
$oBtn.innerHtml
$oBtn.outerHtml
$oBtn.classname
$oBtn.id
$oBtn.name
$oBtn.href
$oBtn.src
$oBtn.click
$oBtn.focus
...
Note that you can use $oBtn.value to read or write to the "Value" property of the html element, but for eg. "itemProp" property $oBtn.itemProp won't work
EXAMPLE:
HTML:
<button id="MyButton" class="someClass" itemprop="streetAddressSubmit" >Click Me</button>
This wont work:
$ItempropValue = $oBtn.itemprop
This is how it should be done:
$ItempropValue = $oBtn.getAttributeNode ('itemprop').NodeValue
Related
I'm facing a strange error in my Angular 4 HTML Template, I'm trying to toggle the class of <i> tag, but only one class shows up, but not the other. Here is my code;
<i [ngClass]="{'fa fa-eye': visible, 'fa fa-eye-slash': !visible}" aria-hidden="true" (click) = "toggle(pass)"></i>
TS:
visible = false;
toggle(event){
this.visible = !this.visible;
}
When i check my app, the first icon shows up i.e. the default on fa fa-eye-slash but when i click on it it shows only box.
Edit:
Tried with different icons from FA, but nothing shows up.
You need to change the html to:
<i class="fa" [ngClass]="{'fa-eye': visible, 'fa-eye-slash': !visible}" aria-hidden="true" (click) = "toggle(pass)"></i>
In the code sample below I have a simple form with two submit buttons.
<form>
<input type="submit" value="< Previous">
<input type="submit" value="Next >">
</form>
Depending on the value attribute the buttons will get different sizes, like the image below:
Is there a method I can use to make the buttons equally sized based on the widest button? I use Bootstrap if that's any advantage...
I know that I could use a fix CSS-width (or similar) to set equal widths on the buttons. But since I don't know how wide the value will be in advance it won't solve the problem... (or will it?).
Use JQuery
var prev = $('#prev').width();
var next = $('#next').width();
if (prev > next) {
$('#next').width(prev);
} else {
$('#prev').width(next);
}
Here is a jsfiddle I made..
If i use below , button display bigger.
<i class="icon-plus"></i>Add
If i use below , button display smaller than above code.
#Html.ActionLink("Add", "xx", "Law", new { _lawfileid = -1, baseappid = ((ObjectModelLibrary.Law)ViewData["currentLaw"]).LawID }, new { #class = "btn btn-primary icon-plus" })
How can i change Html.Actionlink like a href i ?
What is difference between actionlink and href or how can i set same size for both ?
The reason for your issue is that in the first line of code you have an element inside another element. Whereas in the second line of code you have a single element with extra class.
Similar question is already answered on stackoverflow. Please find the link below
Create an ActionLink with HTML elements in the link text
Since you need to build an element inside an element use #Url.Action as mentioned in the above link.
I am trying to bind a range slider with two text input controls. Ideally, I want change in either range slider, text input or viewModel property to update all these controls visually and in sync. But here is my observation.
Changing range slider values by dragging the thumb, updates the viewModel and input text control values
Editing the text in input field in UI updates the viewModel but the rangeSlider is not updated.
Changing the range property in console eg. viewModel.range[0]=-10, does not update the text input value or range slider.
Changing the range slider value programmatically(slider.value([-7. 10])) does not update viewModel or input text.
Here is the code:
Javascript
<script type="text/javascript">
var viewModel = kendo.observable({
range: [-7, 3]
});
$(document).ready(function() {
var slider = $("#slider").kendoRangeSlider({
min: -10,
max: 10
});
kendo.bind($(".QFContent"), viewModel);
});
</script>
HTML
<div class='QFContent'>
<div class='QFReadout QFLowerBound tab-ctrl-formatted-border-hover'>
<div class='QFReadout QFLowerBound tab-ctrl-formatted-border-hover'>
<span class='readoutText tab-ctrl-formatted-fixedsize'></span>
<input data-bind="value: range[0]" data-value-update="keyup" type='text'></input>
</div>
<div class='QFReadout QFUpperBound tab-ctrl-formatted-border-hover'>
<span class='readoutText tab-ctrl-formatted-fixedsize'></span>
<input data-bind="value: range[1]" data-value-update="keyup" type='text'></input>
</div>
<div id="slider" class='QFSlider QFBar' data-bind="value : range">
<input></input>
<input></input>
</div>
</div>
You have to do a bit more work with updating the range as I don't think binding the value to an array[0]/[1] will actually update it.
You will need to call a function that will update the range values when the input box changes. I went ahead and used kendo numerictextboxes, but a regular input box works just as well.
http://jsbin.com/eBOJeceN/2/edit
-- Edit, small bug in that sample, "undefined" isn't undefined. Updated jsbin http://jsbin.com/eBOJeceN/4/edit
I have a form, which has a text area. I want to be able to set the text color of the text inside of the text area when they click the color intended.
So far, I have it to where when they click the color, it sets the hex color inside of a hiddenfield. How could I go about changing the textcolor with css based on the hiddenfield results.
I don't think I can alter the CSS with the GET/POST method, because I want the color to change immediately, not only when the form is posted. Is there a way to do this with either javascript or PHP?
I use the setting of the color to the hiddenfield using (through the img src):
onclick="document.getElementById('color').value = '#ffffff'; " />
HERE IS A JSFIDDLE OF WHAT I HAVE SO FAR:
jsfiddle.net/ymG6t
Ok I figured it out! Instead of using
onclick="document.getElementById('color').value = '#ffffff'; " />
I used: onclick="document.getElementById('color').style.color = '#ffffff';" />
onto the field itself. No need for the hiddenfield!
I have a solution. copy and paste code below:
<script>
function change_color(col){
if ( col == 'red'){
document.getElementById("text").style.color = '#f00';
}
if ( col == 'green'){
document.getElementById("text").style.color = '#0f0';
}
if ( col == 'blue'){
document.getElementById("text").style.color = '#00f';
}
}
</script>
<form>
<input type='radio' onchange="change_color(this.value)" name='color' value='red' >Red<br>
<input type='radio' onchange="change_color(this.value)" name='color' value='green' >Green<br>
<input type='radio' onchange="change_color(this.value)" name='color' value='blue' >Blue<br>
Text:<textarea id='text'>Here is the text that you want to change it's color</textarea>
</form>
Save into a new file with *.php extension.
If you want to save it as html, you must add html tag for header, body and other such as <html> in the beginning, <head>, and then <body>, and of course with it's close tag.
use it as a reference, you can modify the code/script as you need.
may it help! :D