Form Submission, Unique Subject

This is exactly what I'm searching for today - gmail treats all the same subject lines as one conversation and I want to create unique subject lines.

27 minutes ago, wpj said:

it's not working properly. When I check the console it says "Can't find variable: $".

The $ not defined usually means jQuery is not installed.

Add the following to Settings > Advanced > Code Injection > HEADER.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Let us know how it goes.

Can you link to where your form is embedded?

https://www.transformationcounselling.com/your-first-visit

Hi, Has anyone come up with a solution to this? I can't find any element we can change in the code with for instance javascript.... this is causing a real issue!

Yes! It's kinda janky but it works and I tested it. 

In your form create a new Text Form Field (the one with the abc rectangle icon or the T icon) and title the field "Subject." Then put in a Placeholder Text of what you want the user to put in this field. Next check the box to make it a Required Field then hit Apply followed by Done. Test it. Please see my attached image for reference.

If you change the name of the Text Form Field to anything else but "Subject" it will just be another Text Form Field and nothing will happen. Adding a Description will not affect it either. However if you receive multiple forms with the same Placeholder Text filled in to the "Subject" Text Form Field, it will still be interpreted in conversation view in Gmail. Try to come up with something in either the Description/Instructions for this field or Placeholder Text to keep the "Subject" unique from other forms.

Your Gmail Subject line will then come in as "Form Submission - [form name] - [placeholder text of Subject text field]

Hope this helps. It was a headache for me too. My site was previously on the 7.0 template and my husband used some CSS/Javascript (forgive me I'm not a web dev) to generate random numbers in the Subject line to make the forms unique. However in 7.1 that feature seems to not be available anymore, or at least not that he could find/figure out.

I use a similar method as Mochi, but I use Javascript to autofill the Subject field with a Unix Timestamp giving me a unique number at the end of each subject, then I set the CSS value of the form  Subject field and it's Label to none, making it invisible to the user. The Subject field has to be the first field of the form for this to work, as it has no defining attributes, so this simply modifies the 1st field. Seems to be working so far.

PAGE HEADER CODE INJECTION

<script>
$(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

@Ian_A Where do you set the CSS value of the subject and label fields? In the Custom CSS editor, or is that supposed to be accomplished with this script? 

I'm not able to get this to work. 

1. Added new text field and moved to the top field of the form. Set label to "Subject" (also tried leaving blank, text, etc). There is no other/duplicate field in the form labelled Subject. 
2. Copied script text into the Page Header Code Injunction under Page Settings > Advanced.

I would love to be able to use this for our form. I'm not familiar with javascript or CSS, so this is unknown territory for me. Any help is appreciated. :)

@Jenny_M The subject field is automatically created when you add a new form. You need to use that original subject field. You can't delete it and try to create your own later. 

15 hours ago, Ian_A said:

The subject field is automatically created when you add a new form. You need to use that original subject field. You can't delete it and try to create your own later. 

Actually that's not true. You can add a Text field with the label 'Subject' to a Form Block at any time and, assuming it is the only field with this label, the contents will be included in the email subject line.

@paul2009 Is correct. I thought the original subject field was different than the one you can add for some reason, but I went and tested mine and it worked just find with a new text field with a label of 'Subject'.

On 8/16/2021 at 8:49 PM, Ian_A said:

I use a similar method as Mochi, but I use Javascript to autofill the Subject field with a Unix Timestamp giving me a unique number at the end of each subject, then I set the CSS value of the form  Subject field and it's Label to none, making it invisible to the user. The Subject field has to be the first field of the form for this to work, as it has no defining attributes, so this simply modifies the 1st field. Seems to be working so far.

PAGE HEADER CODE INJECTION

<script>
$(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

I don't suppose you have time to write a dummies guide to this? I'm basic level computer literate. Your suggestion sounds EXACTLY what I need but I have no idea how to achieve it! For now I've used Mochi's solution but if possible I'd like to use your solution so that its less reliant on the customer filling in the form correctly. Thank you!

On 8/16/2021 at 2:49 PM, Ian_A said:

I use a similar method as Mochi, but I use Javascript to autofill the Subject field with a Unix Timestamp giving me a unique number at the end of each subject, then I set the CSS value of the form  Subject field and it's Label to none, making it invisible to the user. The Subject field has to be the first field of the form for this to work, as it has no defining attributes, so this simply modifies the 1st field. Seems to be working so far.

PAGE HEADER CODE INJECTION

<script>
$(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Hi Ian_A,

Would you be able to help walk me through how to input this correctly? I am having the same troubles as Jenny_M and would love to get this to work!

1 hour ago, TheMissingPastry said:

Hi Ian_A,

Would you be able to help walk me through how to input this correctly? I am having the same troubles as Jenny_M and would love to get this to work!

@TheMissingPastry 

1. Put a form on the page.

2. Edit the order of the form fields to put the subject field at the very top.

3. Save your changes. 

4. Go to Page Settings > Advanced for the page with the form on it and paste all of the code from <script> to </script> into the page header code injection area. 
 

That’s it. You should see the subject field when editing the page, but not when viewing it as a user. Submit a test of your form and it should have a unique # at the end now. 

@Ian_A — thanks for this solution! I've tried implementing it, but it's not working properly. When I check the console it says "Can't find variable: $".

Here's the code in full I used:

<script>
  $(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Is this still working on your end? Any thoughts would be much appreciated, thank you.

That worked, thank you!

This worked for me today and was a big help. Thank you Ian_A and Paul2009. I had submitted a ticket with SqSp, but they basically told me, no promises. 

On 2/12/2022 at 9:44 PM, wpj said:

@Ian_A — thanks for this solution! I've tried implementing it, but it's not working properly. When I check the console it says "Can't find variable: $".

 

Here's the code in full I used:

<script>
  $(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Is this still working on your end? Any thoughts would be much appreciated, thank you.

set this line line first

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

On 1/22/2022 at 7:20 PM, Ian_A said:

@TheMissingPastry 

1. Put a form on the page.

2. Edit the order of the form fields to put the subject field at the very top.

3. Save your changes. 

4. Go to Page Settings > Advanced for the page with the form on it and paste all of the code from <script> to </script> into the page header code injection area. 
 

That’s it. You should see the subject field when editing the page, but not when viewing it as a user. Submit a test of your form and it should have a unique # at the end now. 

For me it is coming in the body but not on the subject