Filling out a website form with excel vba - html

I have a website that I want to read some data off, do a bunch of calcs, then fill out a form and submit it, all using excel vba.
I can read the website well enough, and do the calcs. I can also fill out a few of the inputs.
However, on this final form, my technique no longer works.
On the first few pages, the html has looked like
<input name="ProjectFile-BuildingPermitNumber" class="form-control" type="text" maxlength="100" data-bind="textInput: ProjectFile().BuildingPermitNumber">
and i I have been using , with elementname being projectfile-buildingpermitnumber
IEValue = objIE.document.getElementsByName(ElementName)(0).Value
to obtain the values and
objHTML.getElementsByName(ElementName)(0).Value = ValueCheck
to return them
I have also used
Set AllLinks = objIE.document.getElementsByTagName("A")
and a for loop to find buttons to click on. not the best technique, i probably should use a .click, but it works.
anyway, on this new form, I do not have an id or name to work with.
<div class="form-group">
<label class="col-sm-3 control-label">
<span> Structural</span>
</label>
<div class="input col-sm-7">
<input class="form-control" type="text" data-bind="value: DrawingsDocuments.Structural">
</div>
</div>
Anyone got an idea on how I can refer to these types of boxes using excel? Ive tried all the different getelement etc that MS HTML controls give.
Regards
Bryan

Related

How do I disable or prevent input text suggestions for form fields in Edge?

How do I prevent a form from suggesting auto-complete values, from previous entries or from saved information in Edge?
In the above image, the email input field is marked as autocomplete="false", but still in the right pane you can see the suggestion is populating.
When I add autocomplete=disabled to one field it seems it work, but when I add the attribute to all the inputs, it again starts displaying suggestions for every field.
What is the solution for this?
Add the aria-autocomplete="list" attribute to the input.
<input type="text" id="FirstName" name="attr1" aria-autocomplete="list">
Do not use any other value for the attribute.
According to your description, I reproduced the problem. I think your issue is caused by the "Save and fill personal info" setting being enabled in Edge.
If you navigate to edge://settings/personalinfo and disable this feature, you can see this behavior no longer exists.
Or you can also click the "Manage personal info" option in the picture you provided, and then disable it.
I did some simple tests and found that if you need to solve the problem from the code, you need to modify the name attribute of the form's related field.
Like this(do not use attribute values like name or email... and maybe there are others I am not aware of):
<label for="attr1">attr1:</label>
<input type="text" id="FirstName" name="attr1">
<label for="attr2">attr2 :</label>
<input type="text" id="LastName" name="attr2">
<label for="attr3">attr3 :</label>
<input type="email" id="Email" name="attr3" autocomplete="off">
<input type="submit">
I don't recommend this, because good naming helps you understand and maintain the code. Using proper attributes like name and email also helps your code be more accessible for screen readers or other assistive technology.

Using pattern and required attribute of input field html at the same time

How can I both validate the pattern of an input field while use required attribute in an html form. I want to make 2 different warning message for each attribute.
<div class="form-group">
<label class="col-md-4 control-label">E-Mail</label>
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span>
<input name="email" placeholder="Địa chỉ E-Mail" class="form-control" type="text" required
pattern=" /^[a-z0-9._%+-]+#[a-z0-9.-]+\.[a-z]{2,4}$/"
oninvalid="this.setCustomValidity('Vui lòng nhập địa chỉ email')"
oninput="setCustomValidity('')"/>
</div>
</div>
</div>
And anyone have a working regex to check valid email? I found that regex on the Internet but it does not work correctly
Keep it simple :o) Unless you really need to go use the Constraint Validation API, as you are currently doing, I would go with regular Form Validation which has pretty good browser support.
Basically when you apply the required attribute on input elements they will be matched against a few conditions. One is the field cannot be left blank. A second is an optional pattern. In your case, you can specify type="email" and the browser will match the input for a valid email address. As far as I can read your request, the following should cover your needs:
<form action="">
<input type="email" required>
<input type="submit">
</form>
The risk of defining a custom pattern using regex is that you might end up testing for a faulty pattern. In your case, testing for example#example.cancerresearch would fail even if it's a valid email address.

How can I append undeletable value in input form?

I'm trying to do something exactly like this sign up form here. They have appended their domain name as undeletable value to allow user to create a sub domain folder. I want to do the same with following input:
<input type="text" class="form-control inputlogin" name="subdomain_name" placeholder="Sub Domain" required="" value=""/>
I found a technique here but I'm not looking to append a prefix. The value must be after like in the example.
It is just a styling trick. input are either completely editable or disabled (not editable at all). There is no way to get around this.
What is done in the form you linked to is a trick where the "frozen" text is placed upon the input field so it looks as if it is a part of the actual input tag, but it is not.
Se my simple jsfiddle illustration. Look at how the styling can be used to create the illusion you want.
Here is an example using Bootstrap 3:
Bootstrap 3 Sub-domain input
<div class="container">
<div class="form-group">
<div class="input-group">
<input type="text" class="form-control" placeholder="Your sub-domaion here">
<span class="input-group-addon" title="Type of Question">.our-domain.com</span>
</div>
</div>
</div>

Angular/bootstrap show specific form validation message

I'd like to have a required email input on a form, and I'd like to augment the input's label to show validity with specific messages. I tried the markup below (simplified, and a few variants). The actual can be found at this fiddle illustrating the problem.
<label for="email">Email
<small class="help-inline" ng-show="form.email.$invalid-required"> (required)</small>
<small class="help-inline" ng-show="form.email.$invalid-email"> (email)</small>
</label>
<div class="input-group">
<input type="email" placeholder="Email" name="email"
ng-model="model.email" required>
I'd like the 'required' message to appear when the input is empty, and when it's non-empty, I'd like the 'email' message to appear conditionally if angular email validation passes.
As you'll see in the fiddle, both messages appear and disappear together, even though, as I use the chrome inspector, the $invalid classes on the input seem to change appropriately. This casts suspicion on the ng-show expression for the errors, but no matter what I try there I get the same behavior.
I've seen a couple answers (like this one) that use a lot of code, but that answer seems a little roundabout. I'm new to web, and already appalled by how bulky the html/code can get (each time I learn about a new streamlining idea, mine seems to double in size)
Thanks in advance.
Change the expression for required to
<label for="email">Email <small class="help-inline" ng-show="!form.email.$viewValue">
and it would work.
The problem with Angular is that it does not allow invalid data in the model. So unless you provide a valid email value the linked model property remains empty and both the required and email validation fail.

How to validate a Classic ASP form with AngularJS

Is it possible to get AngularJS working with Classic ASP? I couldn't find any resources on this, but I suspect the answer would be yes, since AngularJS (excluding its AJAX stuff) is mostly Client Side.
If that is the case, I have a form that looks like this:
How can I use AngularJS to validate this form? The validation I want is:
All Fields Required
Email must be valid format
I know I can use jQuery, but I want to do this with AngularJS. I have already gone ahead and added the AngularJS script to the bottom of the form, also added the ng-app to the <html tag.
I'd like to know the proper, decoupled way of doing this, also if possible, client side end to end test for this simple form, just so that I get the idea.
UPDATE: Thanks to DoubleSharp's link, I have progressed a little, though validation still does not work.
Here is the code I have:
<div class="panel-body" ng-controller="UserCtrl">
<form novalidate class="css-form">
<div class="form-group">
<input type="text" placeholder="First Name" class="form-control" ng-model="user.fname" required />
</div>
<div class="form-group">
<input type="text" placeholder="Last Name" class="form-control" ng-model="user.lname" required />
</div>
<div class="form-group">
<input type="text" placeholder="Email" class="form-control" ng-model="user.email" required />
</div>
<div class="form-group">
<input type="text" placeholder="Password" class="form-control" ng-model="user.password" required />
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
And here is my JavaScript/Angular Code:
function UserCtrl($scope) {
$scope.master= {};
$scope.update = function(user) {
$scope.master = angular.copy(user);
};
$scope.reset = function() {
$scope.user = angular.copy($scope.master);
};
$scope.reset();
}
As you can see I simply copying the tutorial, I have also gone ahead and added the CSS styles, but my validation is still not working, even though the page is freshly loaded, I get ng-pristine ng-invalid ng-invalid-required CSS on my text fields, whereas in the tutorial they have ng-valid
I am guessing this has something to do with ngModel which I have no where, but the tutorial does not mention that at all in its code, I'm confused.
If you just want to validate that the required fields are entered and that the email is in a valid format, it can all be done client side without any calls back to the server, so it doesn't matter if it is ASP classic, PHP, etc... it is all in the browser. The AngularJS site has examples of this, so rather than repeating them here...
See this page for implementing custom form validation: http://docs.angularjs.org/guide/forms
See this page for the email input type: http://docs.angularjs.org/api/ng.directive:input.email