Here is my helper class
class Zend_View_Helper_CommonArea extends Zend_View_Helper_Abstract {
public function commonArea()
{
?>
<div class="clear"></div>
<div id="quick_search">
<div class="search">
<strong>QUICK SEARCH </strong>
<input type="text" name="keyword" id="keyword" value="Enter keywords" class="form" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" />
<select name="select" id="select" class="selectstyled">
<option>Prefered Location</option>
<option>Prefered Location</option>
<option>Prefered Location</option>
<option>Prefered Location</option>
<option>Prefered Location</option>
</select>
</div>
<div class="bt_box">
<input name="find" type="submit" class="find" id="search" value="Find Jobs" />
</div>
<div class="resume"><img src="images/resume.jpg" alt="" /></div>
</div>
<?php
}
}
and My question is , I needed to add a new function to this class. I have tried by adding new function like
public function addBox()
{
?>
<div id="add_right_box"style="height:500px;"><h3 class="add_h2">Width 210px</h3></div>
<?php
}
to the above class, but I am getting eror something like
Plugin by name 'AddBox' was not found in the registry;
Here I need to know Can I add more functions to the helper class , if yes how is this possible.
First, you should return all output, not echo it directly.
From the Zend_View_Helper docs:
In general, the class should not echo or print or otherwise generate output. Instead, it should return values to be printed or echoed. The returned values should be escaped appropriately.
When you call $this->commonArea() from the view, it will load the 'CommonArea' class, and then call the matching method. So a call to $this->addBox() will look for the 'AddBox' class - it won't know that you expect it to be part of the 'CommonArea' plugin.
If you want to call multiple methods from the same plugin, have the matching method return an instance of the plugin:
public function commonArea(){
return $this;
}
Then call the methods like this:
$this->commonArea()->addBox();
$this->commonArea()->display(); //assuming you renamed the original method to 'display'
You could look at the navigation helper or the placeholder helper to see this pattern.
Related
I have a app the creates forms dynamically. In the e2e tests, the e2e creates the form and after the test form will be deleted from the db.
This means I can not use class, ids, or data attribute values because their values are dynamically generated. ie: <div id="input_1642" class="input_1642">. Being the form is created by e2e and destroyed after the test is done, there is no way for me to know their values and they will not persist.
For the following html, in which the only unique value I really have is the required input in <span style="white-space: pre-wrap; overflow-wrap: break-word;">required input</span>
Using Playwright, and not being able to use class, id, or data attribute values, what is the cleanest way to grab (selector) the input so I can page.fill()?
I was hoping to avoid having using Xpath
<div id="input_1642" class="input_1642">
<div>
<div>
<div class="ant-row ant-form-item" style="row-gap: 0px;">
<div class="ant-col ant-form-item-label ant-form-item-label-left">
<label for="input_1642" class="ant-form-item-required" title="">
<span>
<span style="white-space: pre-wrap; overflow-wrap: break-word;">required input</span>
</span>
</label>
</div>
<div class="ant-col ant-form-item-control">
<div class="ant-form-item-control-input">
<div class="ant-form-item-control-input-content">
<span>
<span>
<input formbuilderhiddenfrom="" data-cy="form_item_input_1642_3" data-navigate="false" id="input_1642" class="ant-input align-input-items" type="text" value="">
<span></span>
How about you use a partial selector like this:
page.fill('[data-cy*="form_item_input_"]', 'some text')
To pinpoint the correct element, you can further use the Nth Selector
page.fill('[data-cy*="form_item_input_"] >> nth=0', 'some text')
According to the docs, you can find the element by the text of its label.
You have a label for that input. So you could try something like:
await page.locator('text=required input').fill('some text');
#GetMapping("add")
public String addPart(Model model)
{
model.addAttribute("suppliers", this.partService.getSupplierNames());
model.addAttribute("part", new AddPartViewModel());
return "parts/parts-add";
}
This is my class
public class AddPartViewModel
{
private String name;
private double price;
private int quantity;
private String supplierName;
//PUBLIC GETERS AND SETTERS AND AN EMPTY CONSTRUCTOR
}
Thymeleaf syntax
<div class="form-group">
<label for="supplierName">Example select</label>
<select class="form-control" id="supplierName">
<option th:each="name : ${suppliers}" th:text="${name}" th:field="*{supplierName}"></option>
</select>
</div>
This is the only place where i get error on. The rest of the fragment works correctly, even if just remove the th:field tag the List<String> suppliers parces it self correctly in to the select box. Not i tried to put the th:field in the <select> tag as well, i.e
<select class="form-control" id="supplierName" th:field="*{supplierName}">
but still i get an error during parcing
th:field reffers to a form-backing bean's field, so make sure you've provided the proper bean in a <form> tag (using th:object attribute).
Regarding select: th:field should be provided in a <select> tag, like you've attempted to do. But you should provide also the proper th:value attribute in a <option> tag, so that any value could be assigned to the field.
Your form containing the problematic select should look like this:
<form th:object="${part}">
<div class="form-group">
<label for="supplierName">Example select</label>
<select class="form-control" th:field="*{supplierName}">
<option th:each="name : ${suppliers}" th:value="${name}" th:text="${name}"></option>
</select>
</div>
<!-- the rest of form's inputs and buttons -->
</form>
I have 2 versions of my code, one is not working and the other it is.
My question is "why the not working one is not working?"
here is the JSfiddle http://jsfiddle.net/fhjF7/
The not working version:
Controller:
function Ctrl($scope) {
$scope.username = "username";
$scope.users = [ "Matteo", "Marco", "Michele" ];
};
HTML:
<h1> Not working example</h1>
<div ng-controller="Ctrl">
<div ng-repeat="user in users">
<input type="radio" ng-model="username" name="usern" ng-value="user" />
<strong>{{user}}</strong>
</div>
<div>selected: {{username}}</div>
</div>
and here is the working one, which is almost identical but replacing the string variable with an object:
Controller:
function usersCtrl($scope) {
$scope.names = {username: "username"};
$scope.users = [ "Matteo", "Marco", "Michele" ];
};
HTML:
<h1> Working example</h1>
<div ng-controller="usersCtrl">
<div ng-repeat="user in users">
<input type="radio" ng-model="names.username" name="username" ng-value="user" />
<strong>{{user}}</strong>
</div>
<div>selected: {{names.username}}</div>
</div>
It is because of the way javascript manages function parameters.
The easy way to understand it is that String, Number, and Boolean parameters are always sent byValue, while Objects and Functions are always sent byRef, that is why when you use the dot inside an ng-model it means you are doing a reference to an object which will propagate, while if you don't use a dot inside the ng-model, you are referencing a String, Number or Boolean which is actually a copy of the real variable.
More information here https://egghead.io/lessons/angularjs-the-dot and https://github.com/angular/angular.js/wiki/Understanding-Scopes
Ng-repeats create their own isolate scopes, so that's why the string is not being preserved as it's not pass by reference. If you want to update the model use
<input type="radio" ng-model="$parent.username" name="usern" ng-value="user" />
$parent gives you access to the parents scope which is outside the ng-repeat and should be the one you want.
The answer for your not working code : http://jsfiddle.net/ashuslove/fhjF7/30/
HTML :
<h1> Not working example</h1>
<div ng-controller="Ctrl">
<div ng-repeat="user in users">
<input type="radio" ng-model="names.usern" name="usern" ng-value="user" />
<strong>{{user}}</strong>
</div>
<div>selected: {{names.usern}}</div> //Changed line here
</div>
The function :
function Ctrl($scope) {
$scope.names = {usern: "usern"}; //Also need to change this
$scope.users = [ "Matteo", "Marco", "Michele" ];
};
I need to redirect page into external site with POST parameters, but I cannot use vanilla HTML <form action="url"> like it is explained here:
JSF commandButton - passing POST params to an external site
because then the form would be within a jsf form - and it doesn't work.
Is it possible to use:
FacesContext.getCurrentInstance().getExternalContext().redirect("http://example.com");
with POST parameters without additional vanilla form somehow? Or maybe there is other way to acheive this without form?
Try something like this:
JAVASCRIPT:
function redirect() {
document.getElementById("mySubmitButton").submit();
}
XHTML:
<h:form>
<span onclick="javascript:redirect()" class="linkClass">REDIRECT</span>
</h:form>
<div style="display:none:"> <!-- If you want it hidden -->
<form action="http://external/myplace.html" method="post">
<input type="hidden" value="value1"></input>
<input type="submit" id="mySubmitButton"</input>
</form>
</div>
EDIT: Added another test.
PASSING DYNAMIC PARAMETER:
In this example we assume that we are always going to send a value.
JAVASCRIPT:
function redirect(dynamicValue) {
document.getElementById("dynamicField").value = dynamicValue;
document.getElementById("mySubmitButton").submit();
}
XHTML:
<h:form>
<span onclick="javascript:redirect('myValue')" class="linkClass">REDIRECT</span>
</h:form>
<div style="display:none:"> <!-- If you want it hidden -->
<form action="http://external/myplace.html" method="post">
<input id="dynamicField" type="hidden" value=""></input>
<input type="hidden" value="value1"></input>
<input type="submit" id="mySubmitButton"</input>
</form>
</div>
I have a template like
script type: "text/template", id: "list-template", '''
<div class="display">
<div id="list-name"><%= name %></div>
<span class="list-destroy"></span>
</div>
<div>
<ul id="ul-cards">
</ul>
</div>
<div class="edit">
<input class="list-input" type="text" value="<%= name %>" />
<input id="btnEdit" type="button" value="Save" class="primary wide js-add-list" />
<input id="hdnListId" type="hidden" value="<%= listId%>" />
</div>
<form class="add-list-card js-add-list-card clearfix">
<textarea placeholder="Add card" class="new-card"></textarea>
<input type="button" value="Add" class="primary js-add-card">
<a class="app-icon close-icon dark-hover cancel js-cancel-add-card" href="#" id="closeCard"></a>
</form>
'''
in this template i have <ul id="ul-cards"> element in which i want to render another template which display list inside this ul.
this template is :
script type: "text/template", id: "card-template", '''
<div>
<span class="card-name"><%= name %></span>
</div>
'''
is it possible or i have to do it in another way?
please help me if anyone have idea.
thanks in advace.
it is worked but still i have one problem in data display in
<ul id="ul-cards"> there sholud be 2 as per records in my database but it will display only 1 . data fetch properly but display only last data.
There are two ways to do this: the DOM way and the template way.
The DOM way involves adding your views using DOM methods: you have your ListView and your CardView; the ListView invokes individual CardViews that fill in the ListView's element.
The template way requires that you remember this: backbone's views are policy frameworks, not policy templates. Render doesn't have to render into the DOM. You can use render() to return a string, for example. If your event manager is on the ListView object only (possible; I've done this), then you can have ListView invoke "the resulting array of an array of CardView renders" and insert that directly into ListView's template. This is actually faster, as you only require the browser to analyze the entire ListView HTML blob once, when it's inserted into the innerHTML of the parent DOM object.