sketchucation logo sketchucation
    • Login
    πŸ€‘ SketchPlus 1.3 | 44 Tools for $15 until June 20th Buy Now

    Get form data from webdialogs?

    Scheduled Pinned Locked Moved Developers' Forum
    27 Posts 11 Posters 1.3k Views 11 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Chris FullmerC Offline
      Chris Fullmer
      last edited by

      Hopefully this is simple, but I don't know how to get form data from a webdialog. All the examples show it sending the data to some .asp file, which is not what I want. So say I have a simple list like this:

      <form name="input" action="html_form_action.asp" method="get">
      What kind of shirt are you wearing? <br />
      Shade; 
      
      <input type="radio" name="shade" value="dark">Dark
      <input type="radio" name="shade" value="light">Light <br />
      Size;
      <input type="radio" name="size" value="small">Small
      <input type="radio" name="size" value="medium">Medium
      <input type="radio" name="size" value="large">Large <br />
      <input type="submit" value="submit">
      </form>
      

      So how do I get the submit button to do something to the values so I can use them? Can I send them to a js method somehow?

      Lately you've been tan, suspicious for the winter.
      All my Plugins I've written

      1 Reply Last reply Reply Quote 0
      • tbdT Offline
        tbd
        last edited by

        JavaScript Get or Set Checked Radio Value

        JavaScript Get or Set Checked Radio Value

        favicon

        (www.somacon.com)

        EDIT - added code to parse the form (scroll down)

        
        <form name="input" action="html_form_action.asp" method="get">
        What kind of shirt are you wearing? <br />
        Shade; 
        
        <input type="radio" name="shade" value="dark">Dark
        <input type="radio" name="shade" value="light">Light <br />
        Size;
        <input type="radio" name="size" value="small">Small
        <input type="radio" name="size" value="medium">Medium
        <input type="radio" name="size" value="large">Large <br />
        <input type="submit" value="submit">
        </form>   
        
        <!-- added by TBD -->
        
        <div id="output"></div>
        <script type="text/javascript" charset="utf-8">
        	var output = document.getElementById("output");
        	var form = document.forms[0]
        	var radios = form.elements
        
        	form.onsubmit = function(){
        		output.innerHTML = ""
         		for (var i in radios) {	  	
        			var current = radios[i]
        			if (current.hasOwnProperty("checked"))
        	  		output.innerHTML += current.value + ";" + current.checked + "<br>"
        		}
        		return false;
        	}
        </script>
        
        

        SketchUp Ruby Consultant | Podium 1.x developer
        http://plugins.ro

        1 Reply Last reply Reply Quote 0
        • thomthomT Offline
          thomthom
          last edited by

          <input type="submit" value="submit" id="cmdSend">

          ( Assuming jQuery )

          <span class="syntaxdefault"><br /></span><span class="syntaxkeyword">$(</span><span class="syntaxstring">'#cmdSend'</span><span class="syntaxkeyword">).</span><span class="syntaxdefault">click</span><span class="syntaxkeyword">(&nbsp;function()&nbsp;{<br />&nbsp;&nbsp;</span><span class="syntaxcomment">//&nbsp;Do&nbsp;whatever&nbsp;-&nbsp;send&nbsp;commands&nbsp;to&nbsp;Ruby&nbsp;or&nbsp;make&nbsp;a&nbsp;cake.<br />&nbsp;&nbsp;</span><span class="syntaxkeyword">return&nbsp;</span><span class="syntaxdefault">false&nbsp;</span><span class="syntaxcomment">//&nbsp;This&nbsp;blocks&nbsp;the&nbsp;event&nbsp;from&nbsp;going&nbsp;further.<br /></span><span class="syntaxkeyword">});<br />&nbsp;</span><span class="syntaxdefault"></span>
          

          Thomas Thomassen β€” SketchUp Monkey & Coding addict
          List of my plugins and link to the CookieWare fund

          1 Reply Last reply Reply Quote 0
          • D Offline
            draftomatic
            last edited by

            Instead of sending delimited strings to Ruby from the address bar like this:

            window.location.href = 'skp;some_action@' + var1 + "!@%!%!%$delimeter" + var2;
            

            You can use:

            WebDialog#get_element_value('element_id')
            

            This gets the value attribute of the element with the given id. This is often the easiest way to get form data from a webdialog:

            myWebDialog.add_action_callback('act_on_form_data') { |wd, params|
              field1 = wd.get_element_value('my_form_field_1')
              # Now do something with it...
            }
            
            

            And in JS:

            $('#mySubmitButton').click(function() { window.location.href = 'skp;act_on_form_data@'; });
            

            Also make sure to do this after DOM has loaded using $(document).ready(function() {});

            1 Reply Last reply Reply Quote 0
            • thomthomT Offline
              thomthom
              last edited by

              Though, I don't think you can get the checked state of checkboxes or radio boxes with get_element_value ... if I remember correctly...

              Thomas Thomassen β€” SketchUp Monkey & Coding addict
              List of my plugins and link to the CookieWare fund

              1 Reply Last reply Reply Quote 0
              • jolranJ Offline
                jolran
                last edited by

                @unknownuser said:

                Though, I don't think you can get the checked state of checkboxes or radio boxes with get_element_value ... if I remember correctly...

                Bummer! Was axpecting that for upcoming tests.

                Anyway with some Jquery I got this to show (with get_element_value()) if a checkbox is checked.
                Assuming we have a hidden <div> with id="flipxcontainer".And a checkbox with id="flipx".

                function checkboxess(){
                		$('#flipx').change(function(){
                		
                			if ($(this).checked){
                				$("#flipxcontainer").val("flipxoff");
                			} else{
                				$("#flipxcontainer").val("flipxon");
                			}
                		});
                	}
                
                $(document).ready(function(){ //ONLOAD.
                  checkboxess()
                });
                
                
                

                Then in the action callback(in ruby)

                flipx=@my_dialog.get_element_value("flipxcontainer") 
                			
                			if flipx=="flipxon"
                			 puts "it is checked"
                				else puts " it's not checked"
                			end
                

                It's higly unsofisticated, and I would like some comments if it's not a recommended method.
                I reckon this can be done with radiobuttons as well.

                Is there any issues making multiples get_element_values in a single callbackmethod?

                1 Reply Last reply Reply Quote 0
                • AdamBA Offline
                  AdamB
                  last edited by

                  I have nothing to add other than Chris's avatar image makes me feel distinctly unwell. πŸ’š

                  Developer of LightUp Click for website

                  1 Reply Last reply Reply Quote 0
                  • thomthomT Offline
                    thomthom
                    last edited by

                    πŸ˜†

                    Thomas Thomassen β€” SketchUp Monkey & Coding addict
                    List of my plugins and link to the CookieWare fund

                    1 Reply Last reply Reply Quote 0
                    • Dan RathbunD Offline
                      Dan Rathbun
                      last edited by

                      Has anyone tried using:
                      WebDialog.post_url ??

                      I'm not here much anymore.

                      1 Reply Last reply Reply Quote 0
                      • D Offline
                        driven
                        last edited by

                        Have a look at TextureResizerOptions.htm, it returns all user input on input[type=radio, checkbox or text] using 'name' and 'value' attributes and returns either TRUE/FALSE or string.
                        I replaced a 'text box' with a block of radio buttons for setting 'goldilocks-resolution' yesterday.
                        works a charm, [with a little guidance from Aerilius...]

                        Comment out the existing goldilocks code and drop this in to see the results, uses the existing JS unmodified.

                        <style type="text/css" id="style0">.goldilocks{display;none!important}</style>
                                <br class="goldilocks"/>
                                <input class="goldilocks" type="radio" name="method" value="goldilocks" id="method-goldilocks" />
                                <label class="goldilocks" for="method-goldilocks" title="Calculates the dimensions depending on the current viewport using the plugin Goldilocks.">Goldilocks resolution;</label>
                                <ul class="goldilocks">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                  <li class="flt-r">
                                    <label for="goldilocks-resolution" id="goldi-bg">low 
                        			<input name="goldilocks-resolution" id="goldi-1" class="num goldilocks" type="radio" value="1">
                        			<input name="goldilocks-resolution" id="goldi-2" class="num goldilocks" type="radio" value="2">
                        			<input name="goldilocks-resolution" id="goldi-3" class="num goldilocks" type="radio" value="3">
                        			<input name="goldilocks-resolution" id="goldi-4" class="num goldilocks" type="radio" value="4">
                        			<input name="goldilocks-resolution" id="goldi-5" class="num goldilocks" type="radio" value="5">
                        			<input name="goldilocks-resolution" id="goldi-6" class="num goldilocks" type="radio" value="6">
                        			<input name="goldilocks-resolution" id="goldi-7" class="num goldilocks" type="radio" value="7">
                        			<input name="goldilocks-resolution" id="goldi-8" class="num goldilocks" type="radio" value="8">
                        			  high</label>
                                  </li><br />
                        

                        john
                        PS. you'll need TextureResizer and Goldilocks for it to show.

                        learn from the mistakes of others, you may not live long enough to make them all yourself...

                        1 Reply Last reply Reply Quote 0
                        • jolranJ Offline
                          jolran
                          last edited by

                          So sending 1 large string object(JSON or whatever)in 1 go, to SKP ruby , is the way to go in all circumstances?
                          (Like texture resizer is doing). And not several get_element_values in callback.

                          It seams to me there are 2 ways of doing it, and that is confusing which one to choose.
                          I've seen topic about the subject in this forum and its not easy determin whoose right..

                          Get_element_value method is more straightforward and easier to understand than converting JSON.
                          Maybe thats why JS noobies tend to go with this method first.

                          @Dan

                          @unknownuser said:

                          WebDialog.post_url ??

                          Is it a question if someone tried it? Or do you know it will work πŸ˜„

                          1 Reply Last reply Reply Quote 0
                          • Dan RathbunD Offline
                            Dan Rathbun
                            last edited by

                            @jolran said:

                            @Dan

                            @unknownuser said:

                            WebDialog.post_url ??

                            Is it a question if someone tried it? Or do you know it will work πŸ˜„

                            A Question.

                            It may need to use the standard CGI lib from a full Ruby install.

                            I'm not here much anymore.

                            1 Reply Last reply Reply Quote 0
                            • jolranJ Offline
                              jolran
                              last edited by

                              Common Gateway Interface (CGI)?

                              @unknownuser said:

                              It may need to use the standard CGI lib from a full Ruby install.

                              Ouch. That could be a lot to ask of users.

                              • yet another thing to get into.

                              Thanks for the head up anyway, Dan.

                              1 Reply Last reply Reply Quote 0
                              • Chris FullmerC Offline
                                Chris Fullmer
                                last edited by

                                @adamb said:

                                I have nothing to add other than Chris's avatar image makes me feel distinctly unwell. πŸ’š

                                What about my avatar could possibly make you feel unwell?

                                For some unknown reason, suddenly the whole board was inundated with masks for new user icons one day, and one permanently left its mark on me. Actually I do need to redo my avatar and trim down the belly a little. I lost 50lbs recently, so it shouldn't bulge quite so much πŸ˜„

                                Oh yeah, and I did finally get what I needed working. It took me a while to figure out what it was that I needed. But I did decide to use jquery. I needed a multiple select list, and when the user clicks the submit button, I've got an onclick='submit_form1' that calls my js function. Then the js function uses jquery to gather all selected values into a string and sends it to SketchUp. This works well for my mind to be able to follow the logic of it.

                                function submit_form1(){
                                  var myarr = [];
                                  var str = ''
                                  myarr = $("select option;selected");
                                  $("select option;selected").each(function () {
                                    str += $(this).text() + ",";
                                  });						
                                  alert(str);
                                  query = 'skp;select_scenes@' + str;
                                  window.location.href = query;							
                                }
                                
                                

                                Lately you've been tan, suspicious for the winter.
                                All my Plugins I've written

                                1 Reply Last reply Reply Quote 0
                                • jolranJ Offline
                                  jolran
                                  last edited by

                                  Aha! Scene manager πŸ˜‰

                                  Glad you sorted it out πŸ‘

                                  1 Reply Last reply Reply Quote 0
                                  • D Offline
                                    draftomatic
                                    last edited by

                                    @chris fullmer said:

                                    
                                    >   $("select option;selected").each(function () {
                                    >     str += $(this).text() + ",";
                                    >   });						
                                    > 
                                    

                                    Be careful that your options don't contain commas.

                                    1 Reply Last reply Reply Quote 0
                                    • Chris FullmerC Offline
                                      Chris Fullmer
                                      last edited by

                                      Ah, that did not cross my mind. All my "options" values are scene names. So I'll have to check if scene names can contain commas - if so, I'll have to re-think my delimiter. Thanks!

                                      EDIT - yes, scene names can contain commas. What delimiter do I use then? I'm stumped. Do I forcibly remove commas from the user's scene names before processing? That seems like a bad idea.

                                      Lately you've been tan, suspicious for the winter.
                                      All my Plugins I've written

                                      1 Reply Last reply Reply Quote 0
                                      • thomthomT Offline
                                        thomthom
                                        last edited by

                                        @chris fullmer said:

                                        Do I forcibly remove commas from the user's scene names before processing? That seems like a bad idea.
                                        No, that's not good. That's making the user work for the computer instead of the computer working for the user.

                                        How about || ?
                                        Much more unlikely to appear in a tab.
                                        Though, there is still a risk of it.

                                        You could make a escape character scheme. Escape | with | - then off course you also need to escape \ with \ .

                                        This example is all Ruby, but you can easily port it to JS.

                                        Escape a string:

                                        string = page.name string.gsub!('\\', '\\\\') string.gsub!('|', '\\|')

                                        Restore it:
                                        string.gsub!('\\\\', '\\') string.gsub!('\\|', '|')

                                        If you do it for all input - output then you will be safe that there will never be any conflict.

                                        Thomas Thomassen β€” SketchUp Monkey & Coding addict
                                        List of my plugins and link to the CookieWare fund

                                        1 Reply Last reply Reply Quote 0
                                        • TIGT Offline
                                          TIG Moderator
                                          last edited by

                                          Could you use 'tab' as the delimiter - these are never going to appear in a Scene name ?

                                                $("select option;selected").each(function () {
                                                  str += $(this).text() + "\t";
                                                });                  
                                          
                                          

                                          Then on the Ruby side use chosen=str.split("\t") to make an array of the items ???

                                          TIG

                                          1 Reply Last reply Reply Quote 0
                                          • thomthomT Offline
                                            thomthom
                                            last edited by

                                            @tig said:

                                            Could you use 'tab' as the delimiter - these are never going to appear in a Scene name ?

                                            Actually they can. Paste a string containing Tab and it'll be there. Or it can be added via some Ruby script... pages[0].name = "Foo\tBar"

                                            Thomas Thomassen β€” SketchUp Monkey & Coding addict
                                            List of my plugins and link to the CookieWare fund

                                            1 Reply Last reply Reply Quote 0
                                            • 1
                                            • 2
                                            • 1 / 2
                                            • First post
                                              Last post
                                            Buy SketchPlus
                                            Buy SUbD
                                            Buy WrapR
                                            Buy eBook
                                            Buy Modelur
                                            Buy Vertex Tools
                                            Buy SketchCuisine
                                            Buy FormFonts

                                            Advertisement