0
아래 코드는 사용자 데이터를 python 스크립트로 보내는 것으로 가정합니다. 그러나 제출 버튼이나 양식은 아무 것도하지 않습니다. AngularJS없이 python 스크립트를 테스트했으며 완벽하게 작동합니다. AngularJS가 일반 양식과 호환되지 않습니다.
조금 테스트 후 난 그냥 NG-응용 프로그램을 제거하는 경우 제출 버튼이 아니라합니다 (MD-카드 외부)에 AngularJS와 재료의 일 것이라는 점을 발견했다. 그래서 ng-app가 아마 그렇게 할 것이라고 생각합니다.은 또한 변경 아무것도하지만, 뭔가를 기대하고 스크립트 주변의 NG-응용 프로그램을 이동하려고했다. 파이썬 스크립트 내 일이 아니기 때문에
불행하게도 나는 파이썬 스크립트를 게시 할 수 없습니다.
내가 그런 식에게자바 스크립트, CSS를 쉽게 읽을 수 있으며, 물건 수있는 경우에는이 개 부분에 스크립트를 분할
<html lang="en" >
<head>
<meta charset = "UTF-8">
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link href="https://fonts.googleapis.com/css?family=Fira+Sans" rel="stylesheet">
<style>
/*Centers the main Login box*/
.completeCard
{
margin-left: auto;
margin-right: auto;
width: 50%;
}
/*Centers the introduction Text*/
.introText
{
text-align: center;
font-family: 'Fira Sans', sans-serif;
}
/*modifies the checkbox*/
.checkbox
{
padding-top: 1em;
font-family: 'Roboto', sans-serif;
}
/*Centers the headline*/
.md-headline
{
text-align: center;
}
</style>
<script language="javascript">
var app = angular.module('signIn',['ngMaterial']);
app.controller('inputController', inputController);
function inputController ($scope,$mdDialog)
{
$scope.project = {
comments: 'Comments',
};
//Creates a pop up when the user clicks the submit button
$scope.showAlert = function(ev)
{
$mdDialog.show
(
$mdDialog.alert()
.parent(angular.element(document.querySelector('#dialogContainer')))
.clickOutsideToClose(true)
//title of the pop up alert box
.title('Thank You!')
//The dialog that comes up on the alert box
.textContent("Test")
.ariaLabel('Thank You')
//The close button for the alert box
.ok('Ok!')
.targetEvent(ev)
);
};
}
</script>
바디 파트
<body ng-app="signIn" ng-controller="inputController">
<div id="title" class="introText">
<h1> Sign-In </h1>
</div>
<div id="inputContainer" class="completeCard" ng-controller="inputController as ctrl" ng-cloak>
<md-content layout-padding>
<md-card>
<md-card-title>
<md-card-title-text>
<span class="md-headline">Login</span>
<form method="post" name="projectForm">
<md-input-container>
<label>Secret Key</label>
<input required name="secret" type = "text" ng-model="project.secret" value="$${secret}">
<md-tooltip>Written on a board or ask an representative</md-tooltip>
<div ng-messages ="projectForm.secret.$error">
<div ng-message = "required"> This is required </div>
</div>
</md-input-container>
<md-input-container class="md-block">
<label>Name</label>
<md-tooltip>First and Last Name</md-tooltip>
<input required name="name" type="text" ng-model="project.name" value="$${name}">
<div ng-messages="projectForm.name.$error">
<div ng-message="required">This is required.</div>
</div>
</md-input-container>
<md-input-container class="md-block">
<label>Email</label>
<input required type="email" name="email" ng-model="project.userEmail"
minlength="5" maxlength="100" ng-pattern="/^[email protected]+\..+$/"/value = "$${email}">
<md-tooltip>Please use your School Email</md-tooltip>
<div ng-messages="projectForm.email.$error" role="alert">
<div ng-message-exp="['required', 'minlength', 'maxlength', 'pattern']">
Your email must be between 5 and 100 characters long and should be a valid email address.
</div>
</div>
</md-input-container>
<md-input-container-select>
<md-tooltip>All Majors are in Alphabetical Order</md-tooltip>
<div>
<md-select ng-model="major" placeholder="Major" class="md-no-underline" name="major" value"$${major}">
<md-option value="n/a">Not a Student</md-option>
<md-option value="major1">Major 1</md-option>
<md-option value="major2">Major 2</md-option>
</md-select>
</div>
</md-input-container-select>
<md-checkbox class="green" name = "add_s" value=$${sec_checked}>
Join Mailing List
</md-checkbox>
<!-- <md-card-actions layout="row" layout-align="end center"> -->
<br>
<input type="submit" value="Submit"/>
<div style="color:red; font-size:20pt"> $${response}</div>
</br>
<!-- <md-button type="submit" class="submitButton" ng-click="showAlert($event)">Submit</md-button> -->
<!-- </md-card-actions> -->
</form>
</md-card-title-text>
<md-card-title-media>
<div class="md-media-lg card-media"></div>
</md-card-title-media>
</md-card-title>
</md-card>
</md-content>
</div>
</body>
</html>
수정
여기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sign-in</title>
</head>
<body>
<h1>Sign-in</h1>
<form method="post">
Secret key: <input type="text" name="secret" value="$${secret}"/><br/>
Name: <input type="text" name="name" value="$${name}"/><br/>
Email: <input type="text" name="email" value="$${email}"/><br/>
Major: <input type="text" name="major" value="$${major}"/><br/>
<span style='width:300pt; float:left'>Add me to the CCDC team!</span>
<input type="checkbox" name="add_c" $${ccdc_checked}/><br/>
<span style='width:300pt; float:left'>Add me to the Cyber Defense Team mailing list!</span>
<input type="checkbox" name="add_d" $${cdt_checked}/><br/>
<span style='width:300pt; float:left'>Add me to the SIG-Sec mailing list!</span>
<input type="checkbox" name="add_s" $${sec_checked}/><br/>
<input type="submit" value="Submit"/><br/>
<div style="color:red; font-size:20pt">$${response}</div> <br/>
</form>
</body>
</html>
당신은 showAlert''와'submit' 입력을 결합하지 않는 것 또는 내가 여기서 뭔가를 놓친 거지? – Searching
버튼을 주석으로 처리했습니다. –
는 @AdrianBrand 나는 그것이 내가에 연결된 버튼에서 주석 –