jquery - Issue appending newly changed variable and outputting with Javascript -

-



i have issue following code.

i trying change content of variable if button clicked , output corresponding content part of larger output. output varies depending on if inner button within form clicked.

can suggest fix code or improvements?

in output should see longer version block appended on newly created block , grab new id values generated. great.

here code:

<script>     $(document).ready(function() {         var currentid = 1;         $(':button#add').on('click',function() {             currentid++;             var clone = $('#content').clone();             clone.children('.content_title').attr('id', 'title_content-' + currentid);             clone.children('.content_more').attr('id', 'more_content-' + currentid);             clone.attr("id", "content_1");             clone.insertafter('#content');              if(currentid >= 2) {                 document.getelementbyid("add").style.display = "none";             }         });     }); </script> </head> <body>     <div>         <div>             <form action="" method="post">                 <h1>create code</h1>                 <fieldset>                     <legend><span class="number"></span>header</legend>                     <label for="name">title:</label>                     <input type = "text" id = "title" />                                                                    </fieldset>                 <fieldset id = "content">                     <legend><span class="number"></span>content</legend>                     <label for="name">title:</label>                     <input class = "content_title" type = "text" id = "title_content" />                     <label for="mail">content:</label>                     <input class = "content_more" type = "text" id = "more_content" />                 </fieldset>                 <input id = "add" type = "button" value = "add" />                                                                                                                                                         </form>                 <button onclick="trytest()">code</button>         </div>         <div style = "float:left; width:48%; padding-left:10px;">             <p id="new_block"></p>         </div>     </div>     <script>         function trytest() {             var quote = '"';             var start = "<pre>&lt;div class=" + quote + "newest" + quote + "&gt;</pre>";             var title = "title=" + quote + document.getelementbyid("title").value + quote;             var end = "<pre>&lt;/div&gt;</pre>";              var start_1 = "{{widget type=" + quote + "new_version" + quote;             var title_1 = "title=" + quote + document.getelementbyid("title_content").value + quote;             var content_1 = "content=" + quote + document.getelementbyid("more_content").value + quote;             var end_1 = "template=" + quote + "other" + quote + "}}";              var title_2 = "title=" + quote + document.getelementbyid("title_content-2").value + quote;             var content_2 = "content=" + quote + document.getelementbyid("more_content-2").value + quote;              var widget = start_1 + "<br />" + title_1 + "<br />" + content_1 + "<br />" + end_1;               var widget_1 = start_1 + "<br />" + title_1 + "<br />" + content_1 + "<br />" + end_1 + start_1 + "<br />" + title_2 + "<br />" + content_2 + "<br />" + end_1;               if(add.clicked == false) {                 document.getelementbyid("new_block").innerhtml = start + "<br />" + title + "<br />" + end + "<br /><br />" widget + "<br /><br />";             } else {                 document.getelementbyid("new_block").innerhtml = start + "<br />" + title + "<br />" + end + "<br /><br />" widget_1 + "<br /><br />"";             }     </script>

this code strange mix of jquery , vanilla javascript syntaxes...
work if there no parse error.

those error quite easy find in code editor codepen, way.

  if(add.clicked == false) {     document.getelementbyid("new_block").innerhtml = start + "<br />" + title + "<br />" + end + "<br /><br />" + widget + "<br /><br />";     // added missing + sign --->                --->                --->                --->               here -------^   } else {     document.getelementbyid("new_block").innerhtml = start + "<br />" + title + "<br />" + end + "<br /><br />" + widget_1 + "<br /><br />";     // added missing + sign --->                --->                --->                --->                 here -------^   }  }  // added curly bracket close trytest() function.

just above code block, condition choose string append new_block.

the if(add.clicked == false) { condition evaluates false, because add not defined. property .clicked of undefined, undefined...
"undefined" == false false... , makes else block execute.

this condition fixed avoid cannot read property 'value' of null error on "code" click if "add" has not been clicked.

there couple ways determine if "add" button has been clicked.

  1. check if element title_content-2 exist
  2. use boolean "flag" turned true on "add" click
  3. adding class "add" button on click

i let think solution prefer , try it.

here code freed of mentionned syntax errors in codepen.





wiki

Comments

Post a Comment

Popular posts from this blog

Asterisk AGI Python Script to Dialplan does not work -

-
i'm stuck project have check database of sip extension incoming caller id , dial sip extension. below receive when run script on asterisk cli. -- registered sip '9125' @ 192.168.1.102:50142 > saved useragent "zoiper rv2.8.40" peer 9125 [2017-08-22 13:53:33] notice[5095]: chan_sip.c:24558 handle_response_peerpoke: peer '9125' reachable. (17ms / 2000ms) == using sip rtp tos bits 184 == using sip rtp cos mark 5 -- executing [0112617769@from-trunk:1] answer("sip/obitrunk1-0000000d", "") in new stack > 0x1ca50d0 -- probation passed - setting rtp source address 192.168.1.98:16834 -- executing [0112617769@from-trunk:2] agi("sip/obitrunk1-0000000d", "test.py") in new stack -- launched agi script /var/lib/asterisk/agi-bin/test.py args: ['/var/lib/asterisk/agi-bin/test.py'] env line: agi_request: test.py env line: agi_channel: sip/obitrunk1-0000000d env line: agi_language: en env line: a
Read more

python - Read npy file directly from S3 StreamingBody -

-
i have many .npy (numpy) , .json files saved in s3, need download , load these files. for json files downloading files , loading dictionary using following code: obj = s3.object(bucket, key) response = obj.get() body = response['body'].read().decode('utf-8') data = json.loads(body) that way avoid writing .json file disk , reading it. now want same .npy files, equivalent? currently downloading file, saving temp file on disk , loading np.load avoid if possible. following https://stackoverflow.com/a/28196540/3509999 : obj = s3.object(bucket, key) io.bytesio(obj.get()["body"].read()) f: # rewind file f.seek(0) arr = np.load(f) wiki
Read more

kotlin - Out-projected type in generic interface prohibits the use of metod with generic parameter -

-
i start using kotlin , defined interface this: interface aadapter<vh : recyclerview.viewholder> { fun oncreateaviewholder(parent: viewgroup): vh fun onbindaviewholder(v: vh, position: int) } and when try use on code: class klasa ( private val adapter: aadapter<*> ) { fun dosth(){ //... val vh = this.adapter.oncreateaviewholder(parent) //on below line error adapter.onbindaviewholder(v, position) //... } } i error out-projected type 'aadapter<*>' prohibits use of 'public abstract fun onbindaviewholder(v: t, position: int): unit i tied add "in" or "out" definition i'm confused. how allow it. replace aadapter<*> aadapter<recyclerview.viewholder> . class klasa ( private val adapter: aadapter<recyclerview.viewholder> ) { // ... because have declared aadapter has type parameter vh type subclass of recyclerview.
Read more