I have a site where the client wants records displayed in two columns. I created a couple of scopes and on the page set one column to return odd records and the other to return even records.
These are my scopes:
scope :odd, -> { where("id % 2 = ?", "0") }
scope :even, -> { where("id % 2 = ?", "1") }
Appears to be working but: a) is this proper/safe syntax? b) Is there a simpler way to select odd and even ID numbers?
While a ruby solution is possible, it is more-proper to use CSS. This is because your feature is mainly a presentation concern.
To further point out the distinction I would ask, what if the client comes back and wants a four-column display?
To achieve a display like the following
record 1 | record 2
record 3 | record 4
record 5 | record 6
HTML
<ul id="double">
<li>CSS</li>
<li>XHTML</li>
<li>Semantics</li>
<li>Accessibility</li>
<li>Usability</li>
<li>Web Standards</li>
<li>PHP</li>
<li>Typography</li>
<li>Grids</li>
<li>CSS3</li>
<li>HTML5</li>
<li>UI</li>
</ul>
CSS
ul{
width:600px;
margin-bottom:20px;
overflow:hidden;
border-top:1px solid #ccc;
}
li{
line-height:1.5em;
border-bottom:1px solid #ccc;
float:left;
display:inline;
}
#double li { width:50%;} /* 2 col */
#triple li { width:33.333%; } /* 3 col */
#quad li { width:25%; } /* 4 col */
#six li { width:16.666%; } /* 6 col */
Demo: http://jsfiddle.net/KnXEc/
More: http://csswizardry.com/2010/02/mutiple-column-lists-using-one-ul/
If getting records by odd and even ids is really what you want to do, then your solution is fine. AFAIK there isn't a shortcut for it, because it isn't often done.
One thing you should consider is that the columns may become unbalanced once you start deleting records. That might not be a concern for you, though.
Since you are displaying all records anyway, you could use Enumerable#partition:
#even_ids, #odd_ids = Record.all.partition { |r| r.id.even? }
Related
I currently have something along the lines of
transaction {
FooTable.deleteWhere { FooTable.BarId eq 1 }
}
I want to see how many rows that it successfully deleted (I really just want to make sure there was an entry before and was deleted). Any ideas on how I can do that?
Try this:
transaction {
var numberOfDeletedItems = FooTable.deleteWhere { FooTable.BarId eq 1 }
}
working on the follow code. Having some issues with taking the user input from the day and the temp. I have a start but again running into an issue with Step 2 & 3 unable to pass the information to the array and figure out how to display it. Any insight and direction would be greatly appreciated. Thanks
var temperatures = [];
var days = ["Monday", "Tuesday","Wednesday", "Thursday", "Friday", "Saturday", "Sunday"];
var $ = function (id) {
return document.getElementById(id);
}
var takeTemps = function () {
//###STEP 2
//Get the user inputted temp, validate it making sure it's a number
//if it's valid add it to the temperatures array at the index that
// corresponds with the day of week, e.g. 0 for Monday, 2 for Wednesday
var userTemp=(parseFloat($("tempIn").value));
while (!isNaN(tempIn)==true)
{
alert("Please enter a numeric value");
$("tempIn").focus();
}
//This gets the value from the selected menu option
var index = $("daySelect").value;
for(var dayTemp in temperatures)
{
var daily=temperatures[index]
}
//remove this when done, this just tests your menu you wrote for step 1
alert( index + " indexes day " + days[index]+ userTemp);
//Call displayTemps ONLY if the temp input was valid.
displayTemps();
//EXTRA work / not credit
// have it auto advance the selected day in the menu
// by assigning into $("daySelect").value
// If it was on Sunday change it to Monday and only on valid input
}
var displayTemps = function () {
//###STEP 3
//loop through non-undefined indexes in the temperatures array
//appended them to tempString adding the day .e.x
//Tuesday: 89
//Friday: 98
//display the string to the page by setting the value of the textarea
//
//In the same loop sum the temperatures and count
// how many there are so you can calculate the average
// and output the average temp on the page.
tempString = "";
tempTemp = 0;
for(var i in temperatures) {
tempString += index + ": " + temperatures[i];
}
document.write(tempString + "<br>");
var average =tempTemp+10;
$("tempList").value=tempString;
$("avgOut").value=average;
}
window.onload = function () {
$("addTemp").onclick = takeTemps;
//###STEP 1
//Use a for loop here to write options to the select for each day of the week
// <option value="0">Monday</option>
// using += here with innerHTML property takes the existing values and concats this on the end
for (var i =0; i<7; i++)
{
$("daySelect").innerHTML += "<option value=\""+ i + "\">" + days[i] + "</option>\n";
$("daySelect").value = "";
//var day=i-1;
//var day = days[i];
}
$("tempIn").focus();
}
Struggles with Step 2 and 3 Beleive i have #1 good to go I have enclosed the HTML for reference
<html>
<head>
<script src=script.js></script>
<head>
<body>
<section>
<select id="daySelect">
<option value="">Select a day</option>
</select>
<input type="text" id="tempIn">
<input type="button" id="addTemp" value="add temperature">
<br>
<br>
<label for="tempList">Temperature List</label>
<br>
<textarea id="tempList" rows="7" cols="50"></textarea>
<br>
<label>Average Temperature</label>
<input type="text" id="avgOut" disabled>
</section>
</body></html>
I would suggest to provide more specific information about which part of the code you are concerned with, and especially, provide the HTML code as well since that would enable us to see more clearly what you are trying to do.
When you are done, I will edit this answer and you will get appropriate guidance.
Keep coding!
EDIT
Take a look:
var userTemp=(parseFloat($("tempIn").value));
while (!isNaN(tempIn)==true)
{
alert("Please enter a numeric value");
$("tempIn").focus();
}
Looking at this little piece of code from "Step 2", I can think of a number of bugs already. Of course I'm not sure since I haven't seen your HTML yet, but it seems like:
You have put the value of the input into a variable named userTemp, yet you are checking for a variable named "tempIn" for validation. The second one probably doesn't exist at that point in time. "tempIn" was the name of your DOM element, not the JS variable you've assigned its value. You have to check for the userTemp variable.
In your validation, you are checking for the opposite of isNaN. NaN means "Not a Number", so the opposite of that would be actually number, so the statement is wrong. Not to mention that in this, you would not need to explicitly express "==true", you can check like this: while(isNaN(userTemp))
If you want to iterate a while statement for validation until you get a valid number, you need to put the variable assignment inside the while statement, since you'll need to try to assign the new number each time the validation loop iterates.
EDIT 2 - finished
Your code is live here:
https://codepen.io/bradib0y/pen/OBEdvp?editors=1010
Please note that if you are working your way through a course and this was your assessment, you've gained exactly nothing with me making these tasks for you. You will only gain from getting throught these challenges yourself.
I suggest to spend at least 1 hour with analyzing this code step by step and try to replicate it in a similar project. If you still have struggle with understanding, do yourself a favor and start over with basic javascript once again. You will be an expert on this within a week, if you put the basics down right. But if you still can't grasp the basics and keep pushing forward with more complex issues, you will have a hard time.
i'm using pug as my viewengine for express (node js), but im having trouble with some conditionals. I use a grid framework for newsletter designs which works similar to bootstraps grid, meaning i have rows and columns. I need two items per row, which requires to define a new row every two items. I tried it this way:
each elem,index in elements
- var even = index % 2;
if(even)
.row
.column
else
.column
This doenst work as intended, because the else-column is not nested insinde the row column. I could only find the pugjs.org documentation which is a bit poor on this end, so does anyone have experience with this or a link to more documentation? Thanks a lot.
Pug ignores extra indentation, so what you've written is correctly interpreted as:
each elem,index in elements
- var even = index % 2;
if(even)
.row
.column
else
.column
Note that the last .column is truly a sibling of .row.
Instead, try this—
each element, index in elements
if !(index % 2)
.row
.column
if (index + 1 < elements.length)
.column
When index is even (remember it starts at 0) do the following:
Render a row element with one column
If this isn't the last element, add a second column
When index is odd, do nothing (because we already added the second column).
Note that even though it looks like the second column will be rendered as a child of the first column, the contents of an if statement render at the indentation level of the if statement—so they'll be siblings.
Process elements into groups of two.
-
const groupedElements = elements.reduce(function(acc, curr, index) {
let isEven = (index + 1) % 2;
if (isEven) {
acc.push([curr]);
}
else {
acc[acc.length-1].push(curr);
}
return acc;
}, []);
for group in groupedElements
.row
for item in group
.col
Scenario is after clicking on spin button, if any row has same types of shapes then 500 points should be print in Score box, if any row have same type of 2 shapes and one shape is different than 300 points should be print in Score box,if any row three different shapes then 100 points should print in Score Box.
Document attached,
You haven't mentioned any html or any content . I have some solution which may helps you
Suppose your all 9 images are presenting in a table and the <td> tag changes the class name to correspondent image after spin e.g if td image changes to square image then class added to that td like - <td class="square">
Identify the uniqueness what happening in your html and change the code as per that it is simple logical example -
List<WebElement> allelement = driver.findElements(By.xpath("//table[#id='mytable']//td"));
int count=0;
for(int i=0;i<allelement.size();i++)
{
switch(i)
{
case 0:
case 3:
case 6:
if(allelement.get(i).getAttribute("class").equals(allelement.get(i+1).getAttribute("class")))
{
if(allelement.get(i).getAttribute("class").equals(allelement.get(i+2).getAttribute("class")))
{
System.out.println("Spin 500");
}
else
{
System.out.println("Spin 300");
}
}
else if(allelement.get(i+1).getAttribute("class").equals(allelement.get(i+2).getAttribute("class")))
{
System.out.println("Spin 300");
}
else
{
count++;
if(count==3)
{
System.out.println("Spin 100");
}
}
break;
}
}
I had the requirement where we had to remove a comma from the last record all the records were a hyperlink.
Ex C#,JAVA,IOS all anchor tags as their landing pages were separate.
I thaught of a solution and it worked fine would like to ask whether its the correct way from performance point of view as if the data increases then the looping also increases.
#foreach (var items in Model.Topics)
{
//Saving the index of each record
var index = Model.Topics.LastIndexOf(items);
//Adding 1 on index as it starts from 0 and matching it with the count of the List.If it matches no comma if it doesn't matches then comma
if (index + 1 == Model.Topics.Count())
{
#Html.Raw(items.name)
}
else
{
#Html.Raw(items.name),
}
}
Kindly advice and do post your way of doing the same thing.