Text only
Angular contact form
/raw/2480bde8e5183790a188d09a20f0be71/
2480bde8e5183790a188d09a20f0be71
text
Text only
41
2025-04-04T11:37:09
True
False
False
/api/public/snipt/146988/
angular-contact-form
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1"> 1</a>
<a href="#L-2"> 2</a>
<a href="#L-3"> 3</a>
<a href="#L-4"> 4</a>
<a href="#L-5"> 5</a>
<a href="#L-6"> 6</a>
<a href="#L-7"> 7</a>
<a href="#L-8"> 8</a>
<a href="#L-9"> 9</a>
<a href="#L-10">10</a>
<a href="#L-11">11</a>
<a href="#L-12">12</a>
<a href="#L-13">13</a>
<a href="#L-14">14</a>
<a href="#L-15">15</a>
<a href="#L-16">16</a>
<a href="#L-17">17</a>
<a href="#L-18">18</a>
<a href="#L-19">19</a>
<a href="#L-20">20</a>
<a href="#L-21">21</a>
<a href="#L-22">22</a>
<a href="#L-23">23</a>
<a href="#L-24">24</a>
<a href="#L-25">25</a>
<a href="#L-26">26</a>
<a href="#L-27">27</a>
<a href="#L-28">28</a>
<a href="#L-29">29</a>
<a href="#L-30">30</a>
<a href="#L-31">31</a>
<a href="#L-32">32</a>
<a href="#L-33">33</a>
<a href="#L-34">34</a>
<a href="#L-35">35</a>
<a href="#L-36">36</a>
<a href="#L-37">37</a>
<a href="#L-38">38</a>
<a href="#L-39">39</a>
<a href="#L-40">40</a>
<a href="#L-41">41</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><ion-view title="Contact">
</span><span id="L-2"><a name="L-2"></a>
</span><span id="L-3"><a name="L-3"></a> <ion-content class="has-header padding">
</span><span id="L-4"><a name="L-4"></a> <div class="bar bar-positive" style="margin-bottom: 8px; position: relative;" ng-show="result">{{result}}</div>
</span><span id="L-5"><a name="L-5"></a> <form ng-submit="sendContact()">
</span><span id="L-6"><a name="L-6"></a> <div class="list">
</span><span id="L-7"><a name="L-7"></a> <label class="item item-input item-stacked-label">
</span><span id="L-8"><a name="L-8"></a> <span class="input-label">First Name</span>
</span><span id="L-9"><a name="L-9"></a> <input type="text" ng-model="contact.first_name" placeholder="Enter First Name">
</span><span id="L-10"><a name="L-10"></a> </label>
</span><span id="L-11"><a name="L-11"></a> <label class="item item-input item-stacked-label">
</span><span id="L-12"><a name="L-12"></a> <span class="input-label">Last Name</span>
</span><span id="L-13"><a name="L-13"></a> <input type="text" ng-model="contact.last_name" placeholder="Enter Last Name">
</span><span id="L-14"><a name="L-14"></a> </label>
</span><span id="L-15"><a name="L-15"></a> <label class="item item-input item-stacked-label">
</span><span id="L-16"><a name="L-16"></a> <span class="input-label">Phone #</span>
</span><span id="L-17"><a name="L-17"></a> <input type="text" ng-model="contact.phone" placeholder="Enter Phone Number">
</span><span id="L-18"><a name="L-18"></a> </label>
</span><span id="L-19"><a name="L-19"></a> <label class="item item-input item-stacked-label">
</span><span id="L-20"><a name="L-20"></a> <span class="input-label">Email</span>
</span><span id="L-21"><a name="L-21"></a> <input type="text" ng-model="contact.email" placeholder="Enter Email">
</span><span id="L-22"><a name="L-22"></a> </label>
</span><span id="L-23"><a name="L-23"></a> <label class="item item-input item-stacked-label item-select">
</span><span id="L-24"><a name="L-24"></a> <select ng-model="contact.reason"
</span><span id="L-25"><a name="L-25"></a> ng-init="contact.reason = reasons[0]"
</span><span id="L-26"><a name="L-26"></a> ng-options="reason as reason.name for reason in reasons track by reason.id">
</span><span id="L-27"><a name="L-27"></a> </select>
</span><span id="L-28"><a name="L-28"></a> </label>
</span><span id="L-29"><a name="L-29"></a> <label class="item item-input item-stacked-label">
</span><span id="L-30"><a name="L-30"></a> <span class="input-label">Message</span>
</span><span id="L-31"><a name="L-31"></a> <input type="text" ng-model="contact.message" placeholder="Enter any comments">
</span><span id="L-32"><a name="L-32"></a> </label>
</span><span id="L-33"><a name="L-33"></a> <padding>
</span><span id="L-34"><a name="L-34"></a> <button class="button button-balanced button-block" ng-disabled="!contact.email || !contact.first_name || !contact.last_name">
</span><span id="L-35"><a name="L-35"></a> Send
</span><span id="L-36"><a name="L-36"></a> </button>
</span><span id="L-37"><a name="L-37"></a> </padding>
</span><span id="L-38"><a name="L-38"></a> </div>
</span><span id="L-39"><a name="L-39"></a> </form>
</span><span id="L-40"><a name="L-40"></a> </ion-content>
</span><span id="L-41"><a name="L-41"></a></ion-view>
</span></pre></div>
</td></tr></table>