Ich habe ein Formular erstellt, in dem ich möchte, dass Benutzer unter anderem den gewünschten Raum auswählen. Wenn ich dies als Dropdown oder als Eingabetyp mache, in den sie die Informationen eingeben, wird sie per E-Mail über PHP übermittelt.Versteckter Eingabewert kann nicht von Angular an PHP übergeben werden
Wenn ich jedoch den Eingangstyp auf „versteckt“ zu ändern, ganz der Wert verschwindet und was ich in der Konsole zu sehen, ist dies:
<input _ngcontent-c4 name="room" type="hidden" value class="ng-untouched ng-pristine ng-valid">
Dann wird in dem Netzwerk, erscheint nichts als Objekt für "Zimmer". (Hinweis: andere Objekte werden angezeigt.)
Dann, wenn ich einfach den Stil zu "display: none;" und setzen Sie den Wert = "ChosenRoom", nichts wird in der E-Mail gesendet. In der Tat, obwohl es in der Konsole als
<input _ngcontent-c4 name="room" style="display: none;" type="text" value="ChosenRoom" class="ng-untouched ng-pristine ng-valid">
deutlich angezeigt wird, wird das Objekt nicht im Netzwerk angezeigt.
Jede Idee, was könnte das Problem sein?
Code:
(Ich habe es in einem rudimentären Plunker geschrieben auch: http://embed.plnkr.co/uUhPrStdw4kDhaus2xfO/)
Dies funktioniert, aber der Benutzer hat in den Raumnamen in Form geben:
HTML (Anmerkung:.. ich verließ die Form den verbleibenden Code aus, unter der Annahme, dass es nicht relevant ist in diesem Fall Wenn Sie das denken würde helfen, ich würde gerne, dass auch posten)
<form (submit)="sendEmail(message)" #f="ngForm">
<input type="text" name="room" [(ngModel)]="message.room" #room="ngModel">
<button type="submit" [disabled]="f.invalid" *ngIf="!f.submitted">
</form>
HTML - Dieser zeigt den Wert in der Konsole nicht an.
HTML - Dieser zeigt den Wert in der Konsole, zeigt aber kein Objekt im Netzwerk an.
<form (submit)="sendEmail(message)" #f="ngForm">
<input type="text" style="display: none;" name="room" [(ngModel)]="message.room" #room="ngModel" value="ThisRoom">
<button type="submit" [disabled]="f.invalid" *ngIf="!f.submitted">
</form>
Typoskript: Contact.Service.TS
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { Resolve } from '@angular/router';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
export interface IMessage {
name?: string,
email?: string,
room?: string,
daterange?: string,
message?: string
}
@Injectable()
export class AppService {
private emailUrl = '/assets/email.php';
constructor(private http: Http) {
}
sendEmail(message: IMessage): Observable<IMessage> | any {
return this.http.post(this.emailUrl, message)
.map(response => {
console.log('Sending email was successfull', response);
return response;
})
.catch(error => {
console.log('Sending email got error', error);
return Observable.throw(error)
})
}
}
PHP
<?php
header('Content-type: application/json');
$errors = '';
if(empty($errors))
{
$postdata = file_get_contents("php://input");
$request = json_decode($postdata);
$from_email = '[email protected]';
$message = $request->message;
$from_name = $request->name;
$to_email = "[email protected]";
$contact = "<p><strong>Name:</strong> $from_name</p>
<p><strong>Email:</strong> $request->email</p>
<p><strong>Room:</strong> $request->room</p>
<p><strong>Dates:</strong> $request->daterange</p>";
$content = "<p><strong>Message:</strong><p>$message</p>";
$website = 'My Currently Not but soon to be Functioning Website';
$email_subject = "$website: Received a message from $from_name";
$email_body = '<html><body>';
$email_body .= "$contact $content";
$email_body .= '</body></html>';
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$headers .= "From: $from_email\n";
$headers .= "Reply-To: $from_email";
$result = mail($to_email,$email_subject,$email_body,$headers);
$response_array['status'] = 'success';
$response_array['from'] = $from_email;
$response_array['result'] = $result;
echo json_encode($response_array);
header($response_array);
return $from_email;
} else {
$response_array['status'] = 'error';
echo json_encode($response_array);
header('Location: /error.html');
}
?>
schätze ich Hilfe oder Ideen.
Danke!
Brad
Ist der versteckte Wert in Angular enthalten? Wenn nicht, könnten Sie versuchen, das Problem in einem Plunder zu reproduzieren, da ich das verborgene Feld gut in den Winkelcode einschließen konnte. – Alex
Gute Idee @ AJT_82 Ich habe einen rudimentären Plunker zum Beitrag hinzugefügt. Ich habe eine alternative Lösung gefunden, die das versteckte Feldproblem vermeidet. Also bin ich mir nicht sicher, ob ich tatsächlich ein verstecktes Feld machen kann oder nicht. – AlmostPitt
Das hat nichts damit zu tun, dass es tatsächlich versteckt wird. 'ngModel' überschreibt' value'. Es macht auch keinen Sinn, eine Zwei-Wege-Bindung zu haben, da man das gleiche Objekt aus der Form herausbekommen könnte :) Auch würde ich in diesem Fall vielleicht eine modellgesteuerte Form vorschlagen, die versteckte Eigenschaft wäre leicht zu schaffen mit :) Wenn Sie bei der Vorlage-gesteuerte Formular bleiben möchten, würde ich vorschlagen, dass Sie den Standardwert auf die "Raum" statt. – Alex