CODEWITHSUNDEEP
javamysqldatabasejsp
Adel Zekovic
Adel Zekovic

Reputation: 11

Display values from database in input form (JSP)

i am looking for some better solutions. I am making a matching word game for my school project, but i have some issues. Instead of this code style, i want to my values be displayed from sql database randomly, but without repeating same words. I try something, but it doesnt work, so i will appreciate any of your help.

Here is screenshot of my litlle game: when i click start words will be open, and the game will start...

My code is:

     <!DOCTYPE html>

     <%@page contentType="text/html" pageEncoding="UTF-8"%>
     <%@page import="java.util.*" %>


<%! String[] wordsleft  ={"Belgrade","Zagreb","Sarajevo", "Washington",    "Paris" };

 %>

 <%! String[] wordsright ={"Serbia","Bosnia","Croatia","France","USA"};

 %>

 <%!     
 String printleft(){
       Random rand = new Random();
       int a = rand.nextInt(4 - 0 + 1) + 0;     
       return String.valueOf(wordsleft[a]);
} %>


<%!     
 String printright(){
      Random rand = new Random();
      int a = rand.nextInt(4 - 0 + 1) + 0;  
      return String.valueOf(wordsright[a]);

} %>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="cssstyle.css" rel="stylesheet">
    <title>Matching Words</title>
  </head>
  <body>

    <h1 id="welcome">Welcome!</h1>
    <p class="tekst">Spojnica je igra sa rečima. <br><br>U dve kolone je prikazano po 5 reči.
    Svaka reč u levoj koloni ima svoj par u desnoj koloni. Za svaki spojen par dobijate 3 poena.
</p>

    <div id="container">

              <div  class="containerlevo">
                    <input type="submit" class="leftword" name="prvo" id="firstleft" value="?" />
                    <input type="submit" class="leftword" name="drugo" id="secondleft" value="?" />
                    <input type="submit" class="leftword" name="trece" id="thirdleft" value="?" />
                    <input type="submit" class="leftword" name="trece" id="fourthleft" value="?" />
                    <input type="submit" class="leftword" name="trece" id="fifthleft" value="?" />

            </div>  

            <div  class="containerdesno">
                    <input type="submit" class="rightword" name="prvo" id="firstright" value="?" />
                    <input type="submit" class="rightword" name="drugo" id="secondright" value="?" />
                    <input type="submit" class="rightword" name="trece" id="thirdright" value="?" />
                    <input type="submit" class="rightword" name="drugo" id="fourthright" value="?" />
                    <input type="submit" class="rightword" name="trece" id="fifthright" value="?" />
            </div> 


          <form action="Rezultat" method="post" >                                                               
                    <input class="button start" type="button" id="start"  onclick = "printright(); printleft();" value="START" name="start"/>                     
                    <input class="button" type="submit" id="end" value="END"  name="end"/>      
          </form>           
        </div>                        
  </body>
</html>   

<script>

function printleft(){
    document.getElementById("firstleft").value = "<%= printleft() %>";
    document.getElementById("secondleft").value = "<%= printleft() %>";
    document.getElementById("thirdleft").value = "<%= printleft() %>";
    document.getElementById("fourthleft").value = "<%= printleft() %>";
    document.getElementById("fifthleft").value = "<%= printleft() %>";

    document.getElementById("start").disabled = true;
}

function printright(){
    document.getElementById("firstright").value = "<%= printright() %>";
    document.getElementById("secondright").value = "<%= printright() %>";
    document.getElementById("thirdright").value = "<%= printright() %>";
    document.getElementById("fourthright").value = "<%= printright() %>";
    document.getElementById("fifthright").value = "<%= printright() %>";

    document.getElementById("start").disabled = true;
}

Upvotes: 0

Views: 759

Answers (1)

thst
thst

Reputation: 4602

To use a database on the names is a lot of stuff to add and learn. Maybe you want to start out with name-files - that seems easier to start with.

Nevertheless. First you need to create a database and depending on the jdbc driver used, you will create jdbc connection string to your database (here a mysql).

String connurl = "jdbc:mysql://localhost:3306/riddle?profileSQL=true";

Then you open need to load the driver class once in your application, usually at init() or even better as a context listener. As you are using JDBC it will be best practice to define a datasource in the application deployment descriptor.

Describing all details of this is clearly out of scope here, and definitely has been written up better somewhere else. You can find numerous samples: Netbeans has a tutorial showing this here https://netbeans.org/kb/docs/web/mysql-webapp.html

You should then start with a class that provides you the list of words, a model class. The model class will hide all the data fetching from your JSP page.

And this is where you should go from where you are: Remove all the functions from your JSP and put the data handling in a model class. That model class is then used in your JSP to provide the arrays.

When you got that going, you only need to change the model to read from file instead of const array. If you have that working, tackle the database.

Upvotes: 1

Related Questions