Upgrading site from 3 to 4. Existing code makes use of FullTextSearchable as per this guide that exists for 3, but not for 4. Google only results in unanswered questions of the same nature. Except for this one, which doesn't help. But I do find this guide for SS4, which is not geared towards the same topic really, but somewhat helpful.
Here is my code:
_config.php
\SilverStripe\ORM\Search\FulltextSearchable::enable();
Page.php
use SilverStripe\ORM\Connect\MySQLSchemaManager;
private static $create_table_options = [
MySQLSchemaManager::ID => 'ENGINE=MyISAM'
];
Page.ss
$SearchForm
Expected: Standard search form is displayed
Actual: Nothing is displayed
I went as far as to hard code the form from the existing site onto the template to see if the search function itself works:
Page.ss
<form id="SearchForm_SearchForm" action="/home/SearchForm" method="get" enctype="application/x-www-form-urlencoded">
<p id="SearchForm_SearchForm_error" class="message " style="display: none"></p>
<fieldset>
<input type="text" name="Search" value="Search" class="text nolabel" id="SearchForm_SearchForm_Search">
<div class="form-group">
<input type="submit" name="action_results" value="Go" class="action" id="SearchForm_SearchForm_action_results">
</div>
</fieldset>
</form>
Expected: Search results page displays with relevant search results for the entered term
Actual: 404 page not found
Related
Tried to insert a "select" component under a tab. Basically, the tab just displays some dynamic forms. The select is a list of string for user selection Looks like my definition is correct. Do not know why it messed up the whole angular/clarity UI page.
<clr-tab>
<button clrTabLink>Submission Form</button>
<clr-tab-content>
<br>
<label class="required" for="uniqueCertIDs">Unique Cert IDs</label>
<div class="select">
<select id="partnercertIDs" formControlName="EEPortalProductDetails">
<option *ngFor="let ucertID of uniquecertIDs" [value]="ucertID.UniqueCertId">{{ucertID.UniqueCertId}} </option>
</select>
</div>
Very likely, the scope of the select portion is not correct. Failed finding related documentation.
It's difficult to say whats happening without a running example.
I created a simple form with a select in a tab and it seems to be ok.
Here is the template code for my tabs:
<clr-tabs>
<clr-tab>
<button clrTabLink id="link1">Tab1</button>
<clr-tab-content id="content1" *clrIfActive>
<h3>Form 1</h3>
<form>
<div class="form-group">
<label for="selects_1">This is a select box</label>
<div class="select">
<select id="selects_1">
<option>Select</option>
<option *ngFor="let user of users" [value]="user">{{user}} </option>
</select>
</div>
</div>
</form>
</clr-tab-content>
</clr-tab>
</clr-tabs>
You can see this running here: https://stackblitz.com/edit/so-tabs-form-select
If this doesn't solve your issue, can you fork the StackBlitz and recreate it there?
<form [formGroup]="partnersForm" >
<div class="form-group">
<label class="required" for="selects_1">Unique Cert IDs</label>
<div class="select" >
<select id="selects_1" formControlName="partnerFormCertIDs" ng-change="selectAction()">
<option *ngFor="let ucertID of uniquecertIDs" [value]="ucertID.UniqueCertId" >{{ucertID.UniqueCertId}}</option>
</select>
</div>
</div>
</form>
and in my Session.ts file. Debug using console, the alert never shows up
selectAction() {
alert("selected value changed !!!!");
}
#nextgen-ui Regarding your second issue, the data binding syntax should be either on-change or (change); ng-change is an AngularJS directive.
Please see this Stackblitz.
#Jose Gomes
The event is defined as updateCertData()
<form [formGroup]="partnersForm" >
<div class="form-group">
<label class="required" for="selects_1">Unique Cert IDs</label>
<div class="select">
<select id="selects_1" formControlName="partnerFormCertIDs" (change)="updateCertData()">
<option *ngFor="let ucertID of uniquecertIDs" [value]="ucertID.UniqueCertId">{{ucertID.UniqueCertId}}</option>
</select>
</div>
</div>
</form>
And I defined a POST API in the event
updateCertData(){
let selectedCertID = this.partnersForm.get('partnerFormCertIDs').value;
for ( let partnerInfo of this.uniquecertIDs) {
if(partnerInfo.UniqueCertId == selectedCertID){
this.extractSubmit(this.cert);
this.submit[0].Option[0].value = partnerInfo.ProductId;
this.submit[0].Option[1].value = partnerInfo.ProductName;
this.certsService.setSubmissionProduct(this.certId, this.submit);
break;
}
}
}
this.certsService.setSubmissionProduct is a POST API, sending data back to UI Server
setSubmissionProduct(sessionId: string, info:any){
let body = {'submitConfig': info};
let url = GLOBALS.baseUrl + "session/" + sessionId + "/submitproduct";
return this.post(url, body);
}
The this.post never sends message to the controller successfully. I tried several other post methods, which works well in other logic part, but never sends message successfully if it is put within this "change" event.
I realy like this tools, because of their simplicity and compactness. But sometimes I face lack of plugins / snippets (my JS skills also pretty weak, usually I'm backend developer), so here's one of those cases:
For example, I have simple form like this one:
<div class="row">
<div class="six columns">
<label for="email">Contact email*</label>
<input v-model="email" class="u-full-width" type="email" id="email" placeholder="admin#exchange.com" name="email">
</div>
<div class="six columns">
<label for="date">Launch date*</label>
<input v-model="date" class="u-full-width" type="text" id="date" placeholder="June, 2014">
</div>
</div>
As you can see, I want to make this fields required, email input should be in email format, something like ***#***.***, date field can be anything.
What is the best way to realize it? Also I've found 3 Vue plugins, who's your favorite?
vue-validator
vee-validate
vue-form
Thanks for any examples/snippets/etc
Since you come from backend and are not expert with JS ( neither am I :D ) I suggest you do it yourself. You will learn more.
This is how I would do it:
<input name="email" v-model="email" #keyup="validateEmail()" />
... vue component or instance ...
data: function() { // if you are doing this on Vue instance and not component then data property will look differently but if in component it has to be a function that returns an object
return {
email: ""
}
},
methods: {
validateEmail: function() {
console.log(this.email)
// here you have access to email input as it changes so you can use either regex or substring or some other string manipulation to determine if the string satisfies your criteria
}
I'm building a website to let users design their own mobile app. One side of the website has a form that the user fills out, and the other side has a live preview of the app based off of the form data. This is how it is set up:
Controller:
$scope.primaryColor = "#325490";
Form Input:
<!-- Primary Color -->
<div class="form-group">
<label for="primaryColor" class="col-sm-2 control-label">Primary:</label>
<div class="col-sm-10">
<input type="text" class="form-control" ng-model="$parent.primaryColor">
</div>
</div>
Live Preview:
<div class="mockView" ng-style="{'background-image':'url({{$parent.backgroundFile}})', 'background-color':'{{$parent.primaryColor}}'}">
I have to use $parent because I am using ng-include on my index page to include the form.htm and preview.htm files. I have tested the form and I know it is changing all of the scope variables that I have, but the previewer is not changing. Any help is appreciated!
Remove {{}} and '' and it should work, like this:
<div class="mockView" ng-style="{'background-image':'url({{$parent.backgroundFile}})', 'background-color': $parent.primaryColor }">
I'm coding a plugin that requires forms but I'm having some troubles on post sends.
I had read that the fields names can be a problem for this... But I have 3 fields: cmbParkings, cmbTarifas and dpkFechaEntrada.
My plugin register one custom post type called parking-parkia and one taxonomy for this post type with Ciudades as name.
I don't see where the problem can be! Maybe the field values could be a problem?
Explaination of fields:
cmbParkings is a select filled with all my custom posts (value=id, text=title).
cmbTarifas is dependant from cmbParkings, it loads a metadata from the parking-parkia previously selected (by the moment, value and text = metadata value, containing any characters)
dpkFechaEntrada is a date input.
If I do print_r($_POST) on my 404 page, I see my 404 loaded with the correct values from my form in the $_POST variable.
EDIT: I had comment all fields in form and 404 page still appearing on submit.
Form without fields:
<form id="frmFormularioBusqueda" method="post" action="http://mutuaparkia.extrasoft.es/?p=2632">
<div div="divBotonReserva">
<button type="submit" id="btnEnvioParking">Reservar</button>
</div>
</form>
Form with fields:
<form id="frmFormularioBusqueda" method="post" action="http://mutuaparkia.extrasoft.es/?p=2632">
<div id="selectorParking">
<select id="cmbParkings" name="msolla-cmbParkings">
<option value="0">Elige Parking</option>
<option value="2632">Parking Goya</option>
<option value="2633">Parking Córdoba</option>
<option value="2631">Parking Montalbán</option>
</select>
</div>
<div id="divSelectorTarifa">
<select id="cmbTarifas" name="msolla-cmbTarifas">
<option value="0">Elige Tarifa</option>
</select>
</div>
<div id="divSelectorFecha">
<input id="dpkFechaEntrada" name="msolla-dpkFechaEntrada" type="date">
</div>
<div div="divBotonReserva">
<button type="submit" id="btnEnvioParking">Reservar</button>
</div>
Note: the action url exists and it is ok.
Js that change the action form when the first select is changed:
$( document ).ready(function() {
$("#cmbParkings").change(function(){
//http://mutuaparkia.extrasoft.es/?p=2632
if($.isNumeric($("#cmbParkings").val())){
//$("#frmFormularioBusqueda").attr('action', '/?p=' + $("#cmbParkings").val());
$("#frmFormularioBusqueda").attr('action', $("#txtPermalink" + $("#cmbParkings").val()).val());
}
else{
$("#frmFormularioBusqueda").removeAttr( "action" )
}
$("#cmbTarifas").html($("#cmbTarifas" + $("#cmbParkings").val() ).html());
});
});
Edit: inside if, there is a commented line that it was bad. The new line is working fine now.
Thanks to vard, he had seen that changing the action from from url/?p=id
to the custom post permalink, the code works.
I try to validate a simple form. The validation is well executed but the result page doesn't display the errors.
I use velocity to render the page.
I've used as example the PetClinic project from spring website.
Here is my controller when I hit the "post form" button:
#Controller
#RequestMapping("/subscription")
public class SubscriptionController {
#RequestMapping(value = "/newCustomer", method = RequestMethod.POST)
public String processSubmit(#ModelAttribute Customer customer, BindingResult result, SessionStatus status) {
new CustomerValidator().validate(customer, result);
if (result.hasErrors()) {
return "subscription";
}
else {
status.setComplete();
return "redirect:/admin";
}
}
}
When I go in debug, I see the errors. I'm successfully redirected on the subscription page but the errors are not displayed.
My webpage (simplified):
...
#springBind("customer")
#springShowErrors("<br/>" "")
<form class="form-horizontal" method="post" action="#springUrl("/subscription/newCustomer/")">
....
<!-- Button -->
<div class="controls">
<button class="btn btn-primary">#springMessage("website.subscription.signup")</button>
</div>
</form>
...
if you need anything else, don't hesitate to tell me. Thanks for your help! I'm stuck on this since several days.
EDIT :
I finally found the error. It was with the springBind tag. I didn't well understand that you need to bind the field to show the associated error. Here is the fixed code for one field for twitter bootstrap framework.
#springBind("customer.name")
<div class="control-group #if(${status.error})error#end">
<!-- Prepended text-->
<label class="control-label">#springMessage("website.subscription.name")</label>
<div class="controls">
<div class="input-prepend">
<span class="add-on"><i class="icon-user"></i></span>
<input class="input-xlarge"
placeholder="John Doe" id="name" name="name" type="text">
</div>
<p class="help-block">
#springShowErrors("<br/>" "")
</p>
</div>
</div>
springShowErrors(...) will show all the errors associated with the field name of the POJO customer.