Closed Bug 649382 Opened 10 years ago Closed 10 years ago

Make the 'I'm interested in...' a required field in Get In Touch form

Categories

(www.mozilla.org :: General, defect)

x86
macOS
defect
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: davidwboswell, Assigned: paulosman)

References

(Blocks 1 open bug, )

Details

(Whiteboard: [mentor=davidwboswell])

Attachments

(1 file)

When people use the Get In Touch form they sometimes don't add any information about what they are interested in and it is difficult to know how to help them.

We'd like to try to make this a required field to see if that helps with this or not (if it doesn't we'll turn it back to being optional).

If someone is interested in updating the form to make this field optional and adding the relevant error message, I'm happy to help get the patch on
stage for testing and then get it through the review process to make it
live.
The code for the Get Involved page is at

http://viewvc.svn.mozilla.org/vc/projects/mozilla.org/trunk/contribute/index.html?revision=87161&view=markup

The Get In Touch form is pulled in to the page from an include and the code for the include is at

http://viewvc.svn.mozilla.org/vc/projects/mozilla.org/trunk/includes/community-sub.inc.php?revision=84923&view=markup

If someone wants to make changes to either of these files, I can help test this on our staging site at:

http://www-stage.mozilla.org/contribute/

Changes to this file can be attached to this bug.  Feel free to either edit the file and post the whole new file here or you can read about how to create a patch at

https://developer.mozilla.org/En/Creating_a_patch

If there are any questions about this or if you need additional information, please comment in this bug.
Blocks: 523403
Hi David, 

I've done validation for 'Get In Touch' form in http://www-stage.mozilla.org/contribute/ 

<!--Modified community-sub.inc.php Page starts From here -->
<div id="community-sub">
  <h3>Get In Touch</h3>
  <p>Want to get involved? Send us a note and we can get you started right away.</p>
  <p class="note">This is for volunteer inquiries.  If you are interested in a job, please visit our <a href="http://www.mozilla.com/about/careers.html">Careers</a> page.</p>
<!--Form name Nosnej -->
  <form id="get-involved-form" action="email/" method="post" accept-charset="utf-8" name="gitForm">
    <p><label for="get-involved-email-input">Your email address</label><input type="text" name="address" class="filled" id="get-involved-email-input" value="" placeholder="Your email address" /></p>
    <p><label for="get-involved-interest">Area of interest</label>
      <select id="get-involved-interest" name="area">
        <option selected="selected" disabled="disabled" value="">Area of interest?</option>
        <option value="Support">Helping users</option>
        <option value="Localization">Localization</option>
        <option value="QA">Testing and QA</option>
        <option value="Add-ons">Add-ons</option>
        <option value="Coding">Coding</option>
        <option value="Marketing">Marketing</option>
        <option value="Interface Design">Interface Design and Usability</option>
        <option value="Firefox Suggestions">Firefox Suggestions</option>
        <option value=" ">Something else</option>
      </select>
    </p>
    <p class="comments"><label for="get-involved-comments">Comments</label><textarea id="get-involved-comments" name="comments" class="filled" rows="4" cols="12">Hi! I'm interested in...</textarea></p>
    <input type="hidden" name="robot" value="">
    <input type="hidden" name="cmd" value="sendemail">
    <p><button type="submit" class="submit" onclick="return formValid();">Submit</button></p>
  </form>
</div>
<script type="text/javascript">
//Validation Nosnej
function validemail(email) {
   var mail = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
 
   if(mail.test(email) == false) {
          return false;
   }
}

function formValid()
{
var form=document.gitForm;
var email=document.getElementById('get-involved-email-input').value;
var interest=document.getElementById('get-involved-interest').value;
var comments=document.getElementById('get-involved-comments').value;

if(email=='')
{
alert("Please Provide Your Email Id!");
form.address.focus();
return false;
}
else
 {
 if(validemail(email)==false)
					 {
					 alert("Please Enter A Valid Email!");
					 form.address.focus();
					 return false;
					 }
 }
				 
if(interest=='')
{
alert("Please Select Area Of Interest!");
form.area.focus();
return false;
}

if(comments=='' || comments=="Hi! I'm interested in...")
{
alert("Please Provide some additional information in 'Comments' field!");
form.comments.focus();
return false;
}
return true;
}
</script>

<script type="text/javascript" src="/script/1.0/mozilla-input-placeholder.js"></script>

<!--Modified community-sub.inc.php Page Ends here -->
That's great.  Thanks for posting this change.  Do you want to take a pass at posting this as a patch?  It will make the review and staging process go quicker and is a good thing to get familiar with.  More about creating patches is at

https://developer.mozilla.org/En/Creating_a_patch
Yes David, I want to take a pass.
Great.  Let us know if you have any questions about the patch process.
Thanks. But Could you please help me to create it as a patch @ this time. I'll take care from next time onwards.
Sure.  One way to do it involves checking out the relevant files from our Subversion repository to your local machine, making the change to the file and then running a command to make a diff.

So on my Mac, I did this with the following commands:

> svn co https://svn.mozilla.org/projects/mozilla.org/trunk/includes/

Change into the includes directory, edit the file and then run this command:

> svn diff community-sub.inc.php

The advantage of doing it this way is that it introduces you to our source code repository but it may be a little complicated at first.  There are some simpler online tools that will probably also work, such as

http://www.quickdiff.com/

If you have any questions about this, let me know.
Sure. Thanks David.
Hi David,

I'm Posting Patch for 'community-sub.inc.php' file here...

Index: community-sub.inc.php
===================================================================
--- community-sub.inc.php	(revision 87706)
+++ community-sub.inc.php	(working copy)
@@ -1,27 +1,79 @@
-<div id="community-sub">
-  <h3>Get In Touch</h3>
-  <p>Want to get involved? Send us a note and we can get you started right away.</p>
-  <p class="note">This is for volunteer inquiries.  If you are interested in a job, please visit our <a href="http://www.mozilla.com/about/careers.html">Careers</a> page.</p>
-
-  <form id="get-involved-form" action="/contribute/email/" method="post" accept-charset="utf-8">
-    <p><label for="get-involved-email-input">Your email address</label><input type="text" name="address" class="filled" id="get-involved-email-input" value="" placeholder="Your email address" /></p>
-    <p><label for="get-involved-interest">Area of interest</label>
-      <select id="get-involved-interest" name="area">
-        <option selected="selected" disabled="disabled" value="">Area of interest?</option>
-        <option value="Support">Helping users</option>
-        <option value="Localization">Localization</option>
-        <option value="QA">Testing and QA</option>
-        <option value="Add-ons">Add-ons</option>
-        <option value="Coding">Coding</option>
-        <option value="Marketing">Marketing</option>
-        <option value="Firefox Suggestions">Firefox Suggestions</option>
-        <option value=" ">Something else</option>
-      </select>
-    </p>
-    <p class="comments"><label for="get-involved-comments">Comments</label><textarea id="get-involved-comments" name="comments" class="filled" rows="4" cols="12">Hi! I'm interested in...</textarea></p>
-    <input type="hidden" name="robot" value="">
-    <input type="hidden" name="cmd" value="sendemail">
-    <p><button type="submit" class="submit">Submit</button></p>
-  </form>
-</div>
-<script type="text/javascript" src="/script/1.0/mozilla-input-placeholder.js"></script>
+<!--Modified community-sub.inc.php Page JMJ-->
+<div id="community-sub">
+  <h3>Get In Touch</h3>
+  <p>Want to get involved? Send us a note and we can get you started right away.</p>
+  <p class="note">This is for volunteer inquiries.  If you are interested in a job, please visit our <a href="http://www.mozilla.com/about/careers.html">Careers</a> page.</p>
+<!--Form name Nosnej -->
+  <form id="get-involved-form" action="email/" method="post" accept-charset="utf-8" name="gitForm">
+    <p><label for="get-involved-email-input">Your email address</label><input type="text" name="address" class="filled" id="get-involved-email-input" value="" placeholder="Your email address" /></p>
+    <p><label for="get-involved-interest">Area of interest</label>
+      <select id="get-involved-interest" name="area">
+        <option selected="selected" disabled="disabled" value="">Area of interest?</option>
+        <option value="Support">Helping users</option>
+        <option value="Localization">Localization</option>
+        <option value="QA">Testing and QA</option>
+        <option value="Add-ons">Add-ons</option>
+        <option value="Coding">Coding</option>
+        <option value="Marketing">Marketing</option>
+        <option value="Interface Design">Interface Design and Usability</option>
+        <option value="Firefox Suggestions">Firefox Suggestions</option>
+        <option value=" ">Something else</option>
+      </select>
+    </p>
+    <p class="comments"><label for="get-involved-comments">Comments</label><textarea id="get-involved-comments" name="comments" class="filled" rows="4" cols="12">Hi! I'm interested in...</textarea></p>
+    <input type="hidden" name="robot" value="">
+    <input type="hidden" name="cmd" value="sendemail">
+    <p><button type="submit" class="submit" onclick="return formValid();">Submit</button></p>
+  </form>
+</div>
+<script type="text/javascript">
+//Validation Nosnej
+function validemail(email) {
+   var mail = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
+ 
+   if(mail.test(email) == false) {
+          return false;
+   }
+}
+
+function formValid()
+{
+var form=document.gitForm;
+var email=document.getElementById('get-involved-email-input').value;
+var interest=document.getElementById('get-involved-interest').value;
+var comments=document.getElementById('get-involved-comments').value;
+
+if(email=='')
+{
+alert("Please Provide Your Email Id!");
+form.address.focus();
+return false;
+}
+else
+ {
+ if(validemail(email)==false)
+					 {
+					 alert("Please Enter A Valid Email!");
+					 form.address.focus();
+					 return false;
+					 }
+ }
+				 
+if(interest=='')
+{
+alert("Please Select Area Of Interest!");
+form.area.focus();
+return false;
+}
+
+if(comments=='' || comments=="Hi! I'm interested in...")
+{
+alert("Please Provide some additional information in 'Comments' field!");
+form.comments.focus();
+return false;
+}
+return true;
+}
+</script>
+
+<script type="text/javascript" src="/script/1.0/mozilla-input-placeholder.js"></script>
\ No newline at end of file
Jenson, thanks for doing a patch, but please do it as an attachment on the bug, not inline in a comment, as Bugzilla adds linebreaks in comments that make the patch not apply.
Hi All,

I'm Posting Patch for 'community-sub.inc.php' file here...

Thanks,
Jenson
Comment on attachment 527778 [details] [diff] [review]
Patch for 'community-sub.inc.php' file

Jenson, thanks for posting that patch.  It looks like this patch is picking up some areas of the file that haven't been changed (maybe due to formatting issues?) but this is good for now.

Paul, would you have a chance to review this and suggest any changes that are needed or give any advice on optimizing the patch process?  Thanks.
Attachment #527778 - Flags: review?(paul)
Whiteboard: [contrib-engagement] [mentor=davidwboswell] → [mentor=davidwboswell]
(In reply to comment #12)
> Comment on attachment 527778 [details] [diff] [review]
> Patch for 'community-sub.inc.php' file
> 
> Jenson, thanks for posting that patch.  It looks like this patch is picking up
> some areas of the file that haven't been changed (maybe due to formatting
> issues?) but this is good for now.
> 
> Paul, would you have a chance to review this and suggest any changes that are
> needed or give any advice on optimizing the patch process?  Thanks.

Sure, I'm on PTO this week but I'll make this a priority for Monday.
Assignee: nobody → paul
Ping for review.
Comment on attachment 527778 [details] [diff] [review]
Patch for 'community-sub.inc.php' file

Would it not make more sense to do this validation server-side? We already do some validation for this form in contribute/email/index.php, I would add code for validating the "I'm Interested In.." field there. Easier to follow the convention instead of doing something new.
Attachment #527778 - Flags: review?(paul) → review-
Paul, thanks for taking a look at this.

Jenson, would you be interested in moving this error checking in to contribute/email/index.php ?
Jenson, I just talked with Paul Biggar from the Javascript team and he's interested in helping with your patch as well if you are still interested in working on it.
Hi David,

#cmmnt 16 : Yes I'm interseted.


#cmmnt 17 : Yes I'm still interested. Please help me to connect with Paul Biggar.

Thanks,
Jenson
Jenson, great.  Paul Osman is suggesting adding the form checking in the following file:

http://viewvc.svn.mozilla.org/vc/projects/mozilla.org/trunk/contribute/email/index.php?revision=87889&view=markup

It is true that there is form checking in that file, although the current way errors are handled is not ideal -- people submit the form and are taken to a white page with an error message at the top and they need to go back to re-fill in the form.

Ideally we'd have the error message appear in the form itself so people stay on the page and can more easily change things.  Is it possible to do that by updating the contribute/email/index.php file?  If not, we should re-examine Jenson's original patch.

Any help or guidance from Paul Osman or Paul Biggar would be welcome.
Hi Jenson,

I'm not familiar with the code just yet, but I'll happily review a patch if you move this into contribute/email/index.php. Also, please feel free to ask any specific questions you need answered.
Hi Paul,

But Moving into email directory or merging into index.php file. Can you please explain.

Thanks,
Jenson
(In reply to comment #21)
> Hi Paul,
> 
> But Moving into email directory or merging into index.php file. Can you
> please explain.
> 
> Thanks,
> Jenson

Hi Jenson, try to use the reply feature in Bugzilla, especially since there are two Paul's on this bug :-)

By moving the validation into contribute/email/index.php I'm suggesting two things: 1) that the validation should be done server-side and 2) that it should be in the same place where other form validation is currently being done. 

As David mentioned, the current validation workflow is not very friendly. Ideally, input should be validated in one place (server-side) and if the input fails validation, the user should be redirected back to the form with a friendly error message. Does that make sense?
(In reply to comment #22)
> (In reply to comment #21)
> > Hi Paul,
> > 
> > But Moving into email directory or merging into index.php file. Can you
> > please explain.
> > 
> > Thanks,
> > Jenson
> 
> Hi Jenson, try to use the reply feature in Bugzilla, especially since there
> are two Paul's on this bug :-)
> 
> By moving the validation into contribute/email/index.php I'm suggesting two
> things: 1) that the validation should be done server-side and 2) that it
> should be in the same place where other form validation is currently being
> done. 
> 
> As David mentioned, the current validation workflow is not very friendly.
> Ideally, input should be validated in one place (server-side) and if the
> input fails validation, the user should be redirected back to the form with
> a friendly error message. Does that make sense?

Yes. Thanks Paul.
This was fixed over in Bug 523403.
Status: NEW → RESOLVED
Closed: 10 years ago
Resolution: --- → FIXED
Component: www.mozilla.org → General
Product: Websites → www.mozilla.org
You need to log in before you can comment on or make changes to this bug.