Click here to Skip to main content
15,884,537 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I'm trying to insert something like this photo: https://uupload.ir/files/faj_graph.png[^]
on my page that indicate:
1.Text input for initial node
2.Text input for final node
3.Button to search and show the path from the initial node to final node.
4.Our hierarchical graph.
I want to use the DFS search method in the hierarchical graph I drew and Regex method to search. there is another problem too. because I do not know how to create a graph( because I'm a beginner :( ), I used tables that did not work. Would you please tell me How should I edit the program?

What I have tried:

   <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>AiProject</title>
        
          
    </head>
    <body align=center>
        <script>
        function search(){
            var gstate  = [];
            var regex1  = /(https?:\/\/)?([www.digikala.com])/g
            var regex2  = /(https?:\/\/)?([www.digikala.com/mobile])/g
            var regex3  = /(https?:\/\/)?([www.digikala.com/mobile/xiaomi])/g
            var regex4  = /(https?:\/\/)?([www.digikala.com/mobile/xiaomi/mi9t])/g
            var regex5  = /(https?:\/\/)?([www.digikala.com/mobile/xiaomi/redmi8])/g
            var regex6  = /(https?:\/\/)?([www.digikala.com/mobile/huawei])/g
            var regex7  = /(https?:\/\/)?([www.digikala.com/mobile/huawei/p30pro])/g
            var regex8  = /(https?:\/\/)?([www.digikala.com/mobile/huawei/mate40pro])/g
            var regex9  = /(https?:\/\/)?([www.digikala.com/camera])/g
            var regex10 = /(https?:\/\/)?([www.digikala.com/camera/sony])/g
            var regex11 = /(https?:\/\/)?([www.digikala.com/camera/sony/a7rii])/g
            var regex12 = /(https?:\/\/)?([www.digikala.com/camera/sony/a1])/g
            var regex13 = /(https?:\/\/)?([www.digikala.com/camera/canon])/g
            var regex14 = /(https?:\/\/)?([www.digikala.com/camera/canon/50d])/g
            var regex15 = /(https?:\/\/)?([www.digikala.com/camera/canon/500d])/g
            
          
          var txt = document.getElementById("gaddress").value;
              while (1){
                  var res1  = regex1.test(txt);
                  var res2  = regex2.test(txt);
                  var res3  = regex3.test(txt);
                  var res4  = regex4.test(txt);
                  var res5  = regex5.test(txt);
                  var res6  = regex6.test(txt);
                  var res7  = regex7.test(txt);
                  var res8  = regex8.test(txt);
                  var res9  = regex9.test(txt);
                  var res10 = regex10.test(txt);
                  var res11 = regex11.test(txt);
                  var res12 = regex12.test(txt);
                  var res13 = regex13.test(txt);
                  var res14 = regex14.test(txt);
                  var res15 = regex15.test(txt);
                  if (res1=true){
                document.getElementById("step1").innerHTML = "1";
                     }           
                  if (res2=true){
                document.getElementById("step1").innerHTML = "1";
                document.getElementById("step2").innerHTML = "2";  
                     }           
                  if (res3=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                     }
                  if (res4=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                     }
                  if (res5=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";
                     }
                  if (res6=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                     }
                  if (res7=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                     }
                   if (res8=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                     }
                 if (res9=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";
                     }
                   if (res10=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";    
                 document.getElementById("step10").innerHTML = "10";
                     }
                  if (res11=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";    
                 document.getElementById("step10").innerHTML = "10";
                 document.getElementById("step11").innerHTML = "11";
                     }
                  if (res12=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";    
                 document.getElementById("step10").innerHTML = "10";
                 document.getElementById("step11").innerHTML = "11";     
                 document.getElementById("step12").innerHTML = "12";
                     }
                if (res13=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";    
                 document.getElementById("step10").innerHTML = "10";
                 document.getElementById("step11").innerHTML = "11";     
                 document.getElementById("step12").innerHTML = "12";
                 document.getElementById("step13").innerHTML = "13";
                     }
                   if (res14=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";    
                 document.getElementById("step10").innerHTML = "10";
                 document.getElementById("step11").innerHTML = "11";     
                 document.getElementById("step12").innerHTML = "12";
                 document.getElementById("step13").innerHTML = "13";
                 document.getElementById("step14").innerHTML = "14";
                     }
                  if (res14=true){
                 document.getElementById("step1").innerHTML = "1";
                 document.getElementById("step2").innerHTML = "2";  
                 document.getElementById("step3").innerHTML = "3";
                 document.getElementById("step4").innerHTML = "4";
                 document.getElementById("step5").innerHTML = "5";     
                 document.getElementById("step6").innerHTML = "6";
                 document.getElementById("step7").innerHTML = "7";
                 document.getElementById("step8").innerHTML = "8";
                 document.getElementById("step9").innerHTML = "9";    
                 document.getElementById("step10").innerHTML = "10";
                 document.getElementById("step11").innerHTML = "11";     
                 document.getElementById("step12").innerHTML = "12";
                 document.getElementById("step13").innerHTML = "13";
                 document.getElementById("step14").innerHTML = "14";
                 document.getElementById("step15").innerHTML = "15";
                     }
                       }
        }
       </script>
       <textarea placeholder="Enter your initial address: " id="iaddress"></textarea>
       <textarea placeholder="Enter your goal address: " id="gaddress"></textarea>
       <button onclick="search()">Find path🔎</button>
       <form align=center>
           <table border=1 align=center>
               <tr>
                   <td width=100%>
                       digikala.com
                       <p id="step1"></p>
                   </td>
               </tr>
            </table>
            <table border=1 align=center> 
               <tr>
                   <td>
                       .../mobile
                       <p id="step2"></p>
                   </td>
                   <td width=400>    
                   </td>
                   <td>
                       .../camera
                       <p id="step9"></p>
                   </td>
               </tr>
               </table>  
               
               <table border=1  align=center>
               <tr>
                   <td>
                       .../mobile/xiaomi
                       <p id="step3"></p>
                   </td>
                   <td width=50>    
                   </td>
                   <td>
                       .../mobile/huawei
                       <p id="step6"></p>
                   </td>
                   <td width=300>    
                   </td>
                   <td>
                       .../camera/sony
                       <p id="step10"></p>
                   </td>
                   <td width=50>    
                   </td>
                   <td>
                       .../camera/canon
                       <p id="step13"></p>
                   </td>
               </tr>
               </table>
              
               <table border=1 align=center>
               <tr>
                   <td>
                       .../xiaomi/mi9t
                       <p id="step4"></p>
                   </td>
                   <td>
                       .../xiaomi/redmi8
                       <p id="step5"></p>
                   </td>
                   <td width=50>    
                   </td>
                   <td>
                       .../huawei/p30pro
                       <p id="step7"></p>
                   </td>
                   <td>
                       .../huawei/mate40
                       <p id="step8"></p>
                   </td>
                   <td width=200>    
                   </td>
                   <td>
                       .../sony/a7rII
                       <p id="step11"></p>
                   </td>
                   <td>
                       .../sony/a1
                       <p id="step12"></p>
                   </td>
                   <td width=50>    
                   </td>
                   <td>
                       .../canon/50d
                       <p id="step14"></p>
                   </td>
                   <td>
                       .../canon/500d
                       <p id="step15"></p>
                   </td>
               </tr>
               </table>
       </form>
      
    </body>
</html>
Posted
Comments
jsc42 1-Feb-21 15:18pm    
I have not looked at how you are following the nodes, but there is a problem with your RegEx expressions.
1) You are enclosing your URLs in '[' and ']'. Those delimiters mean 'match any character in the list' s, for example, [www.digikala.com/camera] would match a single character the is any of w, d, i, g, k, a, l, ., c, o, m, /, or r (I've dropped duplicated characters). To match the URL as a string, drop the '[' and ']'. You can keep the '(' and ')' if you want to use subgroups.
2) As you are not using '^' and '$' to anchor at the start and end of the texts, some of the tests will not givemn what you expect e.g. your regex9 will catch anything that also matches regex10 through to regex15 as it contains a subset of all of them.
Also, your 'if' statements are wrong. 'if (res1=true)' will assign the value true to res1 and then the 'if' will see if res1 is true. Ir will always be true as you have just assigned it the value of true. To compare, use '==' e.g. 'if (res1==true)', but since 'if' is comparing the expression for truth anyway, all that you will really need is 'if (res1)'. Ditto for all of the other 'if (resn=true)' when n = 2 to 14.
Member 15061910 1-Feb-21 15:46pm    
Thanks for your useful comment. because I am beginner would you please help me to edit it in a right way??
oLiontas 2-Feb-21 4:58am    
Why you didn't use a library? Like flowchart.js http://flowchart.js.org/

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900