Jump to content


  • Content Count

  • Joined

  • Last visited

Everything posted by ajoo

  1. hi Guru Barand, This is how I finally managed to do it using css $( document ).ready(function(){ ccmatrix = $("#ccMatrix"); var form = $("<form/>", {action: '#',method: '#'}); counter = 0; for(i=0; i<3; i++) { for(j=0; j<3; j++) { ind = j*3+i; if(ind<3) clr = '#ff11aa'; if(ind>=3 && ind<6) clr = '#aaff11'; if(ind>=6 && ind<=9) clr = '#11aaff'; $(ccmatrix).append($("<input/>", { type: 'text', class: 'result', name: 'u_i', size: '1px', tabindex: j*3+i, value: j*3+i })); $("input[tabindex = "+ind+"]").css('backgroundColor', clr); } $(ccmatrix).append('<br>'); } }); using the tabindex property of the input to target a specific input element in the matrix using $("input[tabindex = "+ind+"]").css('backgroundColor', clr); I hope this is the right way to go about it. If there is a better simpler way, please suggest. Could I have done it using say the class property or the name of the input field instead of using tabIndex? If so, then can you kindly demonstrate how it could be done by that method. Thank you !!
  2. Hi, I'll try out things and revert. I created my string of params ( commented in my fiddle ) separated by ',' and space but did not try it with the semi colon.🤔 I do have a question though, by using styles like this would I be upsetting the CSP Policy ? Would this be considered as inline ? In which case it could be a problem since I have kept all my code thus far to be CSV compliant. Thanks loads Guru Barand ! 🙏
  3. Thank you Guru Barand ! May I ask if and how can we set more than one style property in the style attribute passed to input style: 'background-color:'+clr I tried to add change some more styles but either it's not permissible, though i doubt that, or constructing comma separated key : value pairs is not permitted. Please show the correct syntax if that can be achieved. What other key : value can be set in the Input dynamically? Like i said earlier, I could not find any tutorial or example demonstrating other such changes. Finally one last thing, how can I set focus to any one particular box, say the middle one ( 5th one )? Thanks loads !
  4. Hi @Guru Barand : I have modified the jsfiddle slightly and I want to get the bottom two blocks to somehow be placed next to the first red block. https://jsfiddle.net/Lk5fzwbu/ The values inside the boxes are not the inputs but simply a way for me to identify them. This way the tab key moves the cursur down the column of fields as I would want it to move, i.e. downwards and not sideways, I tried to create a param ( commented out in the fiddle ) string to provide for more styles and replace the single background style but it did not work and also, surprisingly, did not give any error as well. The idea was to change the top and left absolute position of the 3rd and 6th box to place them by the side of the first block. The lower boxes would be placed relatively correctly I suppose like in the first block. It did not work at all. 😰 I could not find a single example which shows the usage / correct syntax of style inside the append method. Please suggest. Thanks loads !
  5. Hi all ! Thank you for all the inputs. That's a lot of information to digest early morning !!😄 @ cyberRoot : The values are not available upfront, hence the input fields are used for the grid. But thank you very much for the idea. @,maxxd: I'll check out the grid. I have read about it but thought this should be simple enuff to do using css and positioning. Thank you. @Guru Barand: Sir, it took me a long time to figure this out when i couldn't get to position the blocks correctly and the values in loops made no sense at all. That's when I tried to color the boxes to see what was going on and finally after hours realized that the changes were cascaded to all the previous input elements formed as well. Thanks !
  6. Hi Maxxd ! The code is there on the fiddle https://jsfiddle.net/68pgk2d4/ Could you please elaborate. I have been trying to change the attribs as I create them, but the latest change affects all the previous ones as well. Thank you.
  7. Hi all ! I am trying to make a 3 by 3 grid of input fields inside a form using. I have created a fiddle here https://jsfiddle.net/68pgk2d4/ It simply creates a column of 9 input fields. What I want to do is to place them as below. 1 -- 4 -- 7 2 -- 5 -- 8 3 -- 6 -- 9 If I try and manipulate the css properties of the fields after they have created ( as an eg I have changed the color property ), it affects all the fields created till that stage and not just the newly created field. ( un-commenting i=1, will change the color of all the fields to that color. The magenta color of the 1,2,3 fields also gets changed). I would like to know if there is a way to get a handle on each of the cells so as to target them specifically. Please can someone help me accomplish this. Thanks !
  8. Hi Kicken ! Sorry for the delayed response. In fact I just saw this. I did try this but it there were some issues which I cannot recall immediately. I'll check what the issue was and revert. Thank you.
  9. Hi Requinix, Thanks for the clarifications. Of-course you are correct. No I did not but I found out, it performs a global search across the test string. yes so I reverted my code to exactly as pointed by Guru Barand. That was the correct code. I was getting the error because i was using it on the regex instead of the string. Thanks again !
  10. HI, Thank you all ! @daveyerwin : While most examples use the "/ .... /g" pattern, it seems not to work. Even I was misled by this. 😥 @Guru Barand: Thank you, it works ! 🙏😃 @ requinix: I initially used the /^... $/ but was getting an error & since all examples I saw used the /... /g, I switched. The .test() should be .match(). If I use .test(), i get a " is not a function" error ! .match() works fine. If there is something more esoteric here that I am missing please say. The final working code block : sw_ui = $(".sw_ui").val(); alert(sw_ui); pattern = /^\d+$/; isnum = sw_ui.match(pattern); alert(isnum); Thanks loads !!
  11. I mean the HTML was supposed to be the corrected one and the results it gave was a null. Kindly help to resolve. Thanks !
  12. Hi Guru Barand ! I am sorry the HTML is : <input type="text" class="test" name="sw_ui" value="0" maxlength="6" /> Thanks !
  13. hi, The following bit of code tries to enforce an all digits, with a maxlength of 6, input from the user. The first alert shows the digit correctly while the second alert(check) always gives null. HTML: . . <input type="text" class="sw_ui" name="sw_ui" value="0" maxlength="6" /> . JS: test = $(".test").val(); alert(test); pattern = /[0-9]{6}/g; check = test.match(pattern); alert(check); Can someone please tell me why? What's the mistake here since I should be getting a match. Thanks !
  14. ajoo

    stuck block

    Thanks guys ! @ kicken: Thanks loads. I couldn't have spotted it in 10 days at least. The previous ten bear testimony to that !😲 @ requinix: Thanks for that tip ! I'll bear it in mind.
  15. ajoo

    stuck block

    hi , please can someone check the fiddle https://jsfiddle.net/yqktb40L/18/ and say why the block remains stuck in its position and not oscillate up n down every 2 seconds as it is supposed to. There is nothing wrong with the code. It works great on a local server but does not work in jsfiddle. Thank you.
  16. Hi Guru Barand ! 🤔😲 $(doucment).ready(...) Sir you have the Midas touch ! Thanks loads !
  17. Hi all ! This following code works but HTML: <button class="" id="listen">Play Audio</button> JS: $(document).ready(function(){ $('#listen').click(function(e){ var url = "https://hpr.dogphilosophy.net/test/wav.wav"; var audio = new Audio(url); audio.type = 'audio/wav'; audio.play(); }); }); but only if there is some interaction like the button click on the document first. I would like to get the sounds to play without any interacting controls. Isn't that possible ? Any help appreciated, Thanks !
  18. Hi denno, You are correct about the audio.load. So i modified as follows and was quite hopeful that it would work but it still doesn't var url = "music/beep-07.wav"; var audio = new Audio(url); audio.addEventListener("loadeddata", function() { audio.play(); }, true); It gives this error message though I wonder why because this is the error given by the play() function if you play() the audio directly while it is still loading. Here it is inside the "loadeddata" event handler so the data should have loaded before play() was called. Still at it. Thanks !
  19. Hi ! I have been trying to play sounds using this tiny snippet which gives no errors or warnings but the sounds won't play. var url = "https://hpr.dogphilosophy.net/test/wav.wav"; var audio = new Audio(url); audio.load(); audio.addEventListener("load", function() { audio.play(); }, true); I have checked the sound link and it works directly in the browser. Can someone please help. Thanks.
  20. Thanks kicken ! for this alternate method. I do not fully understand it, but i'll look it up and if need be reopen this thread again. For the time being I have used the hidden field method suggested by Guru Barand ! Thanks loads !
  21. Hi Guru Barand, For an HTML form that is not echoed out in php, the $value variable is checked that it exists, before it is echoed out. value="<?php if(isset($value)) echo html_escape($value);?>" How Is it possible to do the same here ? echo "<td> <input type='text' name='reply[]'class="ansbox" value='$value'></td>"; I have tried without success. Thanks.
  22. Hi, I have another but related question, so I will continue it here rather than in a new thread. I hope that is ok. SO if I modify my code as shown by Kicken like below:- <?php $count = 10; echo "<tr>"; for($j=0; $j<$count; $j++) { echo "<td> <input type='text' name='reply[]'class="ansbox" value=''></td>"; } echo "</tr>"; ?> and once the form has submitted the 10 post values, how can I print those back into their respective places using PHP not JS. I know it will have to echo them inside their value ' ' fields, having checked first if they have been set using isset( .. ), but I don't know the correct syntax to achieve that. Thanks all !
  23. Hi Kicken ! Thanks for the reply and for introducing me to the correct usage ! Even though I am getting the correct answer by using an array for both names and id's and then targeting the id to get the values of the array in JS, getting to know the correct form is so essential. Thanks loads for the correction !
  24. ok Guys, I got it ! While this var test_arr = $("input#reply"); works for dynamically created input boxes using JS, it does not work for boxes created using php. This works though test_arr = $("input[id='reply[]']"); I thought the first one looked more elegant ! Thanks !
  25. Hi all, This bit of code creates an array of input fields using php:- . . . $count = 10; echo "<tr>"; for($j=0; $j<$count; $j++) { echo "<td class=userinp> <input type='text' id='reply[]' value='' ></td>"; } echo "</tr>"; . . I wish to process the values entered in the input fields using JQuery. How can I fetch these user inputs into JQuery correctly ? My JQuery code is : $("#checkbutton").click(function(){ var test_arr = $("input#reply"); $.each(test_arr, function(i, item) { val = $(item).val(); alert(i+" : "+ val); }); }); which displays only the first value of the user input box. It is thus not fetching the array . Please point out the mistake or the correct method to achieve this. Thanks !
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.